ngFor中的Angular 2 NgModel +值不起作用

Question

我在一個簡單的angular2應用程序上工作。

我在ngFormat中得到了ngModule +值的問題。當我使用ngModule時，表單輸入中的值不顯示。如果我刪除ngModule都可以很好地工作。但我需要使用ngModule。與幫助ngModule的數據綁定也正在工作。

這是我的html代碼：

`<div class="col-xs-12" *ngFor="let data of homeData; let i = index"> 
    <div class="row"> 
    <div class="col-xs-12"> 
     <form (ngSubmit)= "updateAddress()"> 
     <div class="form-group"> 
      <input type="text" class="form-control" value="{{data.companyAddress.address}}" name="address{{i}}" [(ngModel)]="address"/> 
     </div> 
     <div class="form-group"> 
      <input type="text" class="form-control" value="{{data.companyAddress.city}}" name="city{{i}}" [(ngModel)]="city"/> 
     </div> 
     <div class="form-group"> 
      <input type="text" class="form-control" value="{{ data.companyAddress.companyName }}" name="companyName{{i}}" [(ngModel)]="companyName"/> 
     </div> 
     <div class="form-group"> 
      <input type="text" class="form-control" value="{{data.companyAddress.country}}" name="country{{i}}" [(ngModel)]="country"/> 
     </div> 
     <div class="form-group"> 
      <input type="text" class="form-control" value="{{data.companyAddress.zipCode}}" name="zipCode{{i}}" [(ngModel)]="zipCode"/> 
     </div> 
     <button type="submit" class="btn btn-default">Submit</button> 
     </form> 

    </div> 
    </div> 

`

在這裏，我的組件：

export class AdminComponent implements OnInit { 
homeData: Object; 
address: String; 
city:String; 
companyName: String; 
country: String; 
zipCode: String; 

    constructor(
private adminServ: AdminService 

) { } 

    ngOnInit() { 
    this.adminServ.getHomeData().subscribe(res => { 
    if(res){ 
     this.homeData = res; 
     console.log(this.homeData); 
    } 
    }); 

    } 

    updateAddress(){ 
    let newAddress = { 
     address: this.address, 
     city: this.city, 
     companyName: this.companyName, 
     country: this.country, 
     zipCode: this.zipCode 
    } 
    console.log(newAddress); 
    } 

} 

感謝您的幫助:)

Answer 1

假設你要更改的值你正在顯示，因爲ngModel是一個雙向綁定，所以value屬性是不必要的。另外，ngModel中的選擇器指向控制器，而不是循環的值。所以下面的代碼應該修復它（對於地址，你可以自己完成:) :)：

<input type="text" class="form-control" name="address{{i}}" [(ngModel)]="data.companyAddress.address"/></div>