2017-09-14 100 views
0

我想在窗體中使用Angular FormGroup(我正在使用Angular 4)將下拉控件的默認值設置爲下拉控件。下拉與給定列表填充好,但默認值不set.Also它沒有顯示的代碼之後的任何錯誤是我使用的代碼 -在Angular Formgroup中初始化下拉列表

HTML代碼

<div class="col-xs-2"> 
    <label class="control-label" for="Country">Country</label> 
    <select formControlName="CountryID" [(ngModel)]="CountryID" class="form-control"> 
     <option *ngFor="let country of Countries" [ngValue]="country.CountryID">{{country.CountryName}}</option> 
    </select> 
</div> 

打字稿代碼

ngOnInit() { 
     this.Countries = [ 
      { "CountryID": 0, "CountryName": "Select Country" }, 
      { "CountryID": 1, "CountryName": "Country 1" }, 
      { "CountryID": 2, "CountryName": "Country 2" }, 
      { "CountryID": 3, "CountryName": "Country 3" }, 
      { "CountryID": 4, "CountryName": "Country 4" }, 
      { "CountryID": 5, "CountryName": "Country 5" } 
     ]; 

     this.inputProcessingForm = this._domBuilder.group({ 
      CandidateBuilderAppId: [''], 
      FirstName: ['Amit'], 
      MiddleInitial: '', 
      LastName: '', 
      Gender: 'S', 
      DateOfBirth: new Date(), 
      SocialSecurityNumber: 0, 
      PersonalEmail: '[email protected]', 
      CorpEmail: '', 
      HomePhone: '', 
      WorkPhone: '', 
      WorkCellPhone: '', 
      WorkFax: '', 
      WorkExtension: '', 
      RemoteFax: '', 
      Address1: '', 
      Address2: '', 
      CountryID: 0, 
      State: 0, 
      City: 0, 
      ZipCode: 0 
     }); 
} 

請建議如果我做錯了什麼。任何幫助,將不勝感激。

回答

0

你可以嘗試從你的模板中刪除[(ngModel)]="CountryID"?根據docs的原因,我猜測其中一個約定(如果使用反應形式,則使用formControlName;如果使用模板驅動形式,則使用ngModel),否則可能會混淆'訪問者'。

+0

謝謝阿邁勒,我這樣做,它的工作 –