ng重复不使用track by更新模型

ng-repeat not update model with track by

本文关键字：track by 更新 模型 ng      更新时间：2023-09-26

我一直在使用检查表模型来处理一组复选框，每个选中的复选框都可以删除。一切似乎都很好，直到我在ng重复中使用它。

问题是，当我添加track by $index和ng-repeat时，删除的复选框仍然存在。如果我删除了track by，它就可以正常工作（但在我真正的应用程序中，我需要track by才能工作）。

这是一个plnkr，演示

要查看问题，您可以按照以下步骤操作。

  1. 选择所需的任意复选框
  2. 删除那些选定的
  3. 检查"全部检查"按钮

现在看看带有track by的那个，它会保留一些复选框。如果手动检查，则会将旧值添加到列表中。这很奇怪。

任何帮助或解释都将不胜感激，感谢

如果您仍然需要跟踪，请将其与对象的id一起使用。假设对象的id始终是唯一的。

将多个跟踪功能解析为同一密钥是错误的。（这意味着两个不同的对象被映射到同一个DOM元素，这是不可能的。）

因此，取而代之的是：

<tr ng-repeat="verb in verbs track by $index">
    <td>
      <input type="checkbox" checklist-model="list.verbs" checklist-value="verb.id">
    </td>
    <td>
      {{verb.id}}
    </td>
    <td>
      <span>{{verb.text}}</span>
    </td>
  </tr>

使用这个：

  <tr ng-repeat="verb in verbs track by verb.id">
    <td>
      <input type="checkbox" checklist-model="list.verbs" checklist-value="verb.id">
    </td>
    <td>
      {{verb.id}}
    </td>
    <td>
      <span>{{verb.text}}</span>
    </td>
  </tr>

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

相关文章：