为什么用我的ngModel和属性绑定形成标签混乱？在ngFor里面的Form标签中的ngModel

1 回答

• 0

  在表单中，名称必须是唯一的 . 所以现在在你的表单中，它并没有被评估为两个不同的团队，因为name属性是相同的 . 这里通常使用索引来区分迭代中的名称，因此：

  *ngFor="let team of group['teams']; let i=index"
  

  和 name 属性

  name="read{{i}}"
  

  您还有一个问题，因为 teams 分为两个不同的组，每个团队在其单独的数组中都有索引0 . 因此，如果使用上述内容，您最终会得到相同的 name 属性 .

  read{{i}} 最终会 read0 仍然无法解决您的问题，因为它将被评估为同一个表单名称 . 因此，您需要使用TWO索引，包括顶级迭代和嵌套迭代：

  <div *ngFor="let group of groups; let j=index">
  

  和

  <tr *ngFor="let team of group['teams']; let i=index">
  

  并标记您的 name 属性：

  name="read{{j}}{{i}}"
  

  现在，表单中的所有项目都具有唯一的名称，因此表单值的结果如下所示：

  {
    "read00": true,
    "download00": true,
    "original00": false,
    "read10": true,
    "download10": true,
    "original10": true,
    "contribute10": true,
    "manage10": false
  }
  

  这就是表单的工作方式 . 所有名称必须是唯一的 .

  这是你的分叉Plunker

  回复于 2024-04-29T17:54:05+08:00