Angular2 - 使用Select2多選擇時綁定到formControl

Question

我想在我的Angular2應用程序中使用Select2。當我選擇選項時，我可以打印出我的選擇，但遇到了將選定選項綁定到角度表單控件的問題。

這是我的html：

<select id="fields" class="form-control fields-select" multiple="multiple" 
     formControlName="branchCode"> 
    <option *ngFor="let field of _availableFields" [value]="field">{{field}} 
    </option> 
</select> 

這是我的TS文件：

private _availableFields: Array<any> = ['Value1', 'Value2', 'Value3']; 
private _selectedFields: Array<string> = []; 

export class AppComponent{ 
    editForm : new FormGroup({ 
     email: new FormControl('', Validators.required), 
     branchCode: new FormControl('', Validators.required), 
}); 
} 

ngAfterViewInit(){ 
    jQuery('.fields-select').select2(); 
    jQuery('.fields-select').on('change', 
     (e) => 
     this._selectedFields = jQuery(e.target).val(); 
     console.log(this._selectedFields); 
    ); 
}; 

我得到了我的變種this._selectedFields選擇。 我怎樣才能將我選擇的this._selectedFields中的值綁定到formControl'branchCode'？

Answer 1

我不認爲使用jQuery select2庫的角度是一個不錯的主意，你應該檢查出ng2-select這是一個類似於select2的庫的角度，你不會遇到這些問題。