web-dev-qa-db-fra.com

* ngPour savoir comment lier chaque élément du tableau à ngModel à l'aide de l'index

=== final mis à jour ==

http://plnkr.co/edit/WKRBB7?p=preview

puisque j'utilise ngModel dans un formulaire, je dois ajouter name attribue.

et mon erreur est que j'ai utilisé la même valeur que son nom.

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

après avoir changé de belows, mon problème est résolu.

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

==========

désolé, je ne me souviens pas pourquoi j'utilise des noms [$ index] .Name au lieu de x.Name.

il y a peut-être des années, je rencontre une erreur en utilisant x.Name, puis j'ai pris l'habitude d'utiliser index.

---mis à jour-----

J'ai besoin d'une table d'édition en ligne, d'une liaison bidirectionnelle.

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

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

initialement les pages montrent:

blank text field; jim

blank text field; tom

après avoir tapé 'aaaaaa' dans le premier champ de texte, cela devient:

aaaaaa; aaaaaa

blank text field; tom

Je pense que la page montrerait initialement:

jim; jim
tom; tom

donc, mon problème est exactement, pourquoi la valeur initiale est manquante?

angularngfor
18
Jinceon

CA devrait etre [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>
11
Günter Zöchbauer

dans votre cas, monsieur, si vous utilisez * ngFor pour la boucle, je ne pense pas que vous ayez besoin d'index. pourquoi ne pas simplement utiliser x.Name. voici le code modifié.

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

ou pouvez-vous essayer cela

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