Angular2の 'ss-multiselect-dropdown'を使用して、選択済み/チェック済みとして既に選択されているデータを表示する方法は？

Question

私はマルチ選択ドロップダウンのために 'ss-multiselect-dropdown'を使用しています。 私はドロップダウンからいくつかのオプションを選択し、データを保存しました。 次回にデータを更新するときは、すでに選択されているデータが選択/確認済みとして表示されます。 単一選択の場合、双方向データバインディング '[（ngModel）]'で動作しますが、選択された複数の値では機能しません。 'ss-multiselect-dropdown'を使って、既に選択されたデータを選択/表示する方法を表示/設定するには？

ありがとうございます！

selecOptions = []; 

HTML側：あなたは配列を使用することができ、このため

Answer 1

    <ss-multiselect-dropdown 
          [options]="finalServices" 
          [texts]="myTexts" 
          [settings]="mySettings" 
          [(ngModel)]="selecOptions" 
          (ngModelChange)="onChangeService($event)" 
          [ngModelOptions]="{standalone: true}"> 
        </ss-multiselect-dropdown> 

は、この内の選択を覚えてはfinalServicesのオブジェクト配列内のid存在に基づいています。

Answer 2

複数選択で再生するplunkerを作成しました。

//our root app component 
import {Component, NgModule, VERSION} from '@angular/core' 
import {BrowserModule} from '@angular/platform-browser' 
import {Component} from '@angular/core'; 
import { IMultiSelectSettings, IMultiSelectTexts } from 'angular-2-dropdown-multiselect/src/multiselect-dropdown'; 
import { MultiselectDropdownModule} from 'angular-2-dropdown-multiselect'; 
import { FormsModule } from '@angular/forms'; 

@Component({ 
    selector: 'my-app', 
    template: ` 
     <ss-multiselect-dropdown [options]="myOptions" [texts]="myTexts" [settings]="mySettings" [(ngModel)]="optionsModel"></ss-multiselect-dropdown> 
    `, 
}) 
export class App { 
    optionsModel: number[] = [ 2, 3]; 

// Settings configuration 
mySettings: IMultiSelectSettings = { 
    enableSearch: true, 
    checkedStyle: 'fontawesome', 
    buttonClasses: 'btn btn-default btn-block', 
    dynamicTitleMaxItems: 3, 
    displayAllSelectedText: true 
}; 

// Text configuration 
myTexts: IMultiSelectTexts = { 
    checkAll: 'Select all', 
    uncheckAll: 'Unselect all', 
    checked: 'item selected', 
    checkedPlural: 'items selected', 
    searchPlaceholder: 'Find', 
    searchEmptyResult: 'Nothing found...', 
    searchNoRenderText: 'Type in search box to see results...', 
    defaultTitle: 'Select', 
    allSelected: 'All selected', 
}; 

// Options 
myOptions: IMultiSelectOption[] = [ 
    { id: 1, name: 'Volvo'}, 
    { id: 2, name: 'Honda'}, 
    { id: 3, name: 'BMW'}, 
    { id: 4, name: 'Audi'}, 
]; 

} 

@NgModule({ 
    imports: [ BrowserModule,MultiselectDropdownModule, FormsModule ], 
    declarations: [ App ], 
    bootstrap: [ App ] 
}) 
export class AppModule {} 

詳細はhereを参照してください。