* ngFor如何每個項目在使用陣列索引

因爲我的形式使用ngModel，我必須補充name attribue。

我的錯誤是我使用了與其名稱相同的值。

<form #myform="ngForm"> 
    <table> 
     <tr *ngFor="let staff of staffs"> 
     <td><input name="name" [(ngModel)]="staff.name">{{staff.name}}</td> 
     </tr> 
    </table> 
</form>

當我改變到下面，我的問題得到解決。

<form #my2form="ngForm"> 
    <table> 
     <tr *ngFor="let staff of staffs;let i = index"> 
     <td><input name="staff.{{i}}.name" [(ngModel)]="staff.name">{{staff.name}}</td> 
     </tr> 
    </table> 
</form>

==========

抱歉，我不記得爲什麼我使用的名稱[$指數]請將.Name代替x.Name。

也許幾年前我遇到了一些使用x.Name的錯誤，並且制定了使用索引的習慣。

---更新-----

我需要一個內嵌編輯表，雙向綁定。

<table> 
    <tr *ngFor="let x of names"> 
    <td><input [(ngModel)]="x.Name">{{x.Name}}</td> 
    </tr> 
</table> 

let names = [ 
{ Name:'jim'}, 
{ Name:'tom'} 
];

最初的頁面顯示：

blank text field; jim 

blank text field; tom

後，我在第一個文本字段中鍵入 'AAAAAA'，就變成：

aaaaaa; aaaaaa 

blank text field; tom

我認爲網頁將首先顯示：

jim; jim 
tom; tom

所以，我的問題究竟是，爲什麼初始值缺失？

來源

2017-01-14 Jinceon

請檢查文檔第一https://angular.io/docs/ts/latest/ –

爲什麼你不綁定到'x.Name '？ –

@TamasHegedus可能無法工作（不完全確定），但我記得'[（ngModel）] =「...」'不適用於模板變量的錯誤消息，但除此之外，一個很好的建議 - 絕對值得嘗試。 –

，如果你使用的是* ngFor for循環的話，我不這麼認爲，你需要指數應該[ngModel]="..."

<table> 
    <tr *ngFor="let x of names;let i = index;"> 
    <td>{{ i+ 1 }}</td> 
    <td><input [(ngModel)]="names[i].Name">{{x.Name}}</td> 
    </tr> 
</table>

來源

2017-01-14 16:51:33

謝謝@micronyks我不確定他是否想要雙向綁定。是'ng-model'自動雙向的嗎？我對Angular1的瞭解不多。 –

是的，它在'Angular1.x'中是默認的，歡迎您！ – micronyks

在你的情況下，先生

。你爲什麼不使用x.Name。這裏是修改後的代碼。

<table> 
     <tr *ngFor="let x of names;let i = index;"> 
     <td>{{ i+ 1 }}</td> 
     <td><input [(ngModel)]="x.Name">{{x.Name}}</td> 
     </tr> 
    </table>

，或者你可以試試這個

<table> 
      <tr *ngFor="let x of names;let i = index;"> 
      <td>{{ i+ 1 }}</td> 
      <td><input [value]="x.Name" [(ngModel)]="x.Name">{{x.Name}}</td> 
      </tr> 
     </table>

來源

2017-01-14 17:12:37 himanshu

* ngFor如何每個項目在使用陣列索引

回答

相關問題