如果 ng-hide 或 ng-show 从 ng-repeat 中控制，则 ng-hide 或 ng-show 不起作用

Question

如果单击 ng-repeat 中的任何按钮，我会尝试隐藏 div。但是它似乎不起作用，这让我想到如果 ng-hide 或 ng-show 是从 ng-repeat 中控制的，它是否不起作用？

<div data-ng-hide="showChooseHardware">
    <table class="table">
        <tbody>
            <tr data-ng-repeat="hardware in hardwares">
                <td>{{hardware.name}}</td>
                <td>
                    <button type="button" class="btn" data-ng-click="showChooseHardware=!showChooseHardware"/>
                </td>
            </tr>
        </tbody>
    </table>
</div>

Answer 1

这是因为 ng-repeat 为每个模板创建了一个新范围，并且由于原型继承在 JavaScript（和 AngularJS）中的工作方式。

使用对象：

$scope.viewModel = { showChooseHardware: false };

HTML:

data-ng-hide="viewModel.showChooseHardware"

并且：

data-ng-click="viewModel.showChooseHardware=!viewModel.showChooseHardware"

可以找到关于此问题的很好的解释 here。

我建议在这种情况下使用 ng-show，因为变量被称为 showChooseHardware。

Answer 2

ngRepeat 指令在每次迭代中创建新的范围，因为 array.It 中的每个项目都可能产生问题，你有。

如果 ng-hide 或 ng-show 从 ng-repeat 中控制，则 ng-hide 或 ng-show 不起作用

ng-hide or ng-show does not work if its controlled from within a ng-repeat

angularjs

ng-repeat

ng-show

ng-hide