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

Question

我有一个简单的表格行。

该行由以下代码生成。

<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时为每个循环创建子范围。简而言之，cacheChanged中的ng-repeat变量与cacheChanged上使用的button变量不同。

加价

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

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