2017-09-14 5 views
0

J'essaie de définir une valeur par défaut pour un contrôle déroulant dans un formulaire utilisant Angular FormGroup (j'utilise Angular 4). La liste déroulante bien avec la remplit liste donnée, mais la valeur par défaut est set.Also pas son ne présentant aucune erreur dans le code suivant est le code que j'utilise -Initialiser la liste déroulante dans Angular Formgroup

Code 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> 

Code typographique

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 
     }); 
} 

S'il vous plaît me suggérer si je fais quelque chose de mal. Toute aide serait appréciée.

Répondre

0

Pourriez-vous essayer de supprimer le [(ngModel)]="CountryID" de votre modèle? Cause selon docs, je suppose que l'une des conventions (formControlName si vous utilisez des formulaires réactifs ou ngModel si vous utilisez des formulaires pilotés par template) doit être utilisée, sinon elle pourrait confondre 'accessor'.

+0

Merci amal, je l'ai fait et ça a marché –