ng-change 在 ng-repeat 生成的 table 行中不起作用

Question

我有一个简单的 table 行。

该行由以下代码生成。

<tr ng-init="cacheChanged">
    <td>Expiration Period</td>
    <td ng-repeat="system in tableData.regions[0].systems">
        <input type="text" ng-model="system.cacheDuration" ng-change="cacheChanged=true">
        <span>h</span>
    </td>
    <td>
        <button type="button" ng-click="saveCache()" ng-disabled="!cacheChanged">Save</button>
    </td>
</tr>

当四个值中的任何一个发生变化时，保存按钮应该被启用。但是，它仍然始终处于禁用状态。任何人都知道为什么？提前致谢！

Answer 1

在您的情况下，您应该使用 $parent.cacheChanged 而不是 cacheChanged 变量。由于 ng-repeat 在渲染 DOM 时确实为每个循环创建了子作用域。简而言之，ng-repeat 中的 cacheChanged 变量与 button 上使用的 cacheChanged 变量不同。

标记

<td ng-repeat="system in tableData.regions[0].systems">
    <input type="text" ng-model="system.cacheDuration" ng-change="$parent.cacheChanged=true">
    <span>h</span>
</td>

有更好的方法是在定义 ng-model 时使用 Dot rule，查看详细的 answer here。

ng-change 在 ng-repeat 生成的 table 行中不起作用

ng-change does not work in the table row generated by ng-repeat

angularjs

ng-repeat

angularjs-ng-repeat