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>