webapp/src/app/sdks/sdkSelectDropdown.component.ts

   1 import { Component, Input } from "@angular/core";
   2
   3 import { ISdk, SdkService } from "../services/sdk.service";
   4
   5 @Component({
   6     selector: 'sdk-select-dropdown',
   7     template: `
   8         <div class="btn-group" dropdown *ngIf="curSdk" >
   9             <button dropdownToggle type="button" class="btn btn-primary dropdown-toggle" style="width: 20em;">
  10                 {{curSdk.name}} <span class="caret" style="float: right; margin-top: 8px;"></span>
  11             </button>
  12             <ul *dropdownMenu class="dropdown-menu" role="menu">
  13                 <li role="menuitem"><a class="dropdown-item" *ngFor="let sdk of sdks" (click)="select(sdk)">
  14                     {{sdk.name}}</a>
  15                 </li>
  16             </ul>
  17         </div>
  18     `
  19 })
  20 export class SdkSelectDropdownComponent {
  21
  22     // FIXME investigate to understand why not working with sdks as input
  23     // <sdk-select-dropdown [sdks]="(sdks$ | async)"></sdk-select-dropdown>
  24     //@Input() sdks: ISdk[];
  25     sdks: ISdk[];
  26
  27     curSdk: ISdk;
  28
  29     constructor(private sdkSvr: SdkService) { }
  30
  31     ngOnInit() {
  32         this.curSdk = this.sdkSvr.getCurrent();
  33         this.sdkSvr.Sdks$.subscribe((s) => {
  34             if (s) {
  35                 this.sdks = s;
  36                 if (this.curSdk === null || s.indexOf(this.curSdk) === -1) {
  37                     this.sdkSvr.setCurrent(this.curSdk = s.length ? s[0] : null);
  38                 }
  39             }
  40         });
  41     }
  42
  43     select(s) {
  44         this.sdkSvr.setCurrent(this.curSdk = s);
  45     }
  46 }
  47
  48