Jak ustawić domyślnie wybraną wartość w rozwijaniu angualr2 za pomocą ng-select?

Question

Użyłem angular2 rozwijaną wielokrotnego wartości przy użyciu kodu follwing:

<ng-select [options]="dropDownSKUNumber" #SKUNumberDrp multiple="true" placeholder="Select SKU Number" [allowClear]="true"></ng-select> 

Ten kod działa prawidłowo dla mnie w momencie zapisać wiele wartości. Następnie, ale w trybie widoku, chcę te wartości domyślnie w wybranym trybie na liście rozwijanej, ale nie mogę tego zrobić.

Jak go rozwiązać? używając powyższego kodu.

Answer 1

Ponieważ używasz opcji, musisz używać this ng2-select. W takim przypadku powinieneś powiązać go z ngModel, a następnie zaktualizować tę wartość w init skryptu:

I.e. HTML

<ng-select 
    [multiple]="true" 
    [options]="myOptions" 
    [(ngModel)]="mySelectValue"> 
</ng-select> 

TS

export class App implements OnInit { 

    myOptions: Array<any>; 
    mySelectValue: Array<string>; // Array of strings for multi select, string for single select. 

    ngOnInit() { 
     this.myOptions = [ 
      {value: 'a', label: 'Alpha'}, 
      {value: 'b', label: 'Beta'}, 
      {value: 'c', label: 'Gamma'}, 
     ]; 
     this.mySelectValue = ['b', 'c']; 
    } 
} 

Answer 2

Według angular2 select można użyć ngModel ustawić wartość początkowa:

można użyć options jako tablicy i ngModle dla wybranej wartości w składniku, jak poniżej:

//Component 
public dropDownSKUNumber : any[] = [ 
    { value: 1, label : 1 }, 
    { value: 2, label : 2 }, 
    { value: 3, label : 3 } 
]; 
public selectedValue: string[] = [ '2', '3' ]; 

//HTML 
<ng-select [options]="dropDownSKUNumber" #SKUNumberDrp multiple="true" placeholder="Select SKU Number" [(ngModel)]="selectedValue" [allowClear]="true"></ng-select>