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

   1 import { Component, Input } from "@angular/core";
   2
   3 import { ISdk, SdkService } from "../common/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.sdkSvr.Sdks$.subscribe((s) => {
  33             this.sdks = s;
  34             this.curSdk = this.sdks.length ? this.sdks[0] : null;
  35             this.sdkSvr.setCurrent(this.curSdk);
  36         });
  37     }
  38
  39     select(s) {
  40          this.sdkSvr.setCurrent(this.curSdk = s);
  41     }
  42 }
  43
  44