選択した値をAngular 2のドロップダウンで設定します

Question

私はFormBuilderを使用してDBに値を追加しています。私が私が私が私もこの

this._commServe.addExternalCompany(company).subscribe((data) => { 
    this.formUser.value.externalCompany = company.CompanyName; 
}, (error) => { 
    this.errorMessage = <any>error; 
}) 

を試してみました

<select class="form-control" id="companyExternal" formControlName="externalCompany" (ngModelChange)=onChangeExternalC($event)> 
    <option value="" >Select existing company...</option> 
    <option value="{{company}}" *ngFor="let company of externalCompanies">{{company}}</option> 
    <option value="Company name..." >ADD ANOTHER...</option> 
</select> 

予め提出しその値にドロップダウン（外部会社）の値を設定するこれらの値を追加する前に

this.formUser = this._form.group({ 
    "firstName": new FormControl('', [Validators.required]), 
    "lastName": new FormControl('', [Validators.required]), 
    "externalCompany": new FormControl('', [Validators.required]) 
}) 

期待通りに動作しなかったngModelを使ってみました。

は最良の方法は、あなたがモデルで選択した値を持つオプションにselected属性を設定することができます例

Answer 1

のためのjQueryに頼ることなく、このドロップダウンリストの選択状態を設定するのでは何だろう。

そのHTMLテンプレートの使用

[attr.selected]="selectedExternalCompany" 

：

<select class="form-control" id="companyExternal" formControlName="externalCompany" (ngModelChange)=onChangeExternalC($event)> 
    <option value="" >Select existing company...</option> 
    <option value="{{company}}" 
     *ngFor="let company of externalCompanies" 
     [attr.selected]="selectedExternalCompany" 
     >{{company}}</option> 
    <option value="Company name..." >ADD ANOTHER...</option> 
</select> 

そしてselectedExternalCompany選択ボックスの変更およびインスタンスのためのモデルとしてそれを使用する設定コンポーネントでは。

これは、回答に基づいています。How to add conditional attribute in Angular 2?