如果变量在使用它的块内被修改，则可以ng

Can ng-if variable be modified inside a block that is using it?

本文关键字：修改 ng 变量 如果      更新时间：2023-09-26

我觉得这个问题很奇怪。

基本上，我希望一个块存在于基于ng-if条件的页面上。但当我试图修改所述块中的ng-if时，它对任何其他元素都没有任何影响。

为什么会发生这种情况？

JSFiddle在这里，代码如下：

<div ng-controller="MyCtrl">
    <div ng-init="shouldShow=false">
        <div ng-if="!shouldShow">
            <p>{{shouldShow}}</p>
            <div>
                <button ng-click="shouldShow=!shouldShow">Hide Section</button>
                <button ng-if="!shouldShow">Should Disappear</button>
            </div>
        </div>
    </div>
</div>

这是ng-if子作用域的问题，也是您试图在子作用域中双向绑定基元的事实。

您应该始终尝试将作用域中的对象用作models，以便充分利用原型继承的好处。

点击此处查看差异：

<div ng-controller="Ctrl">
      <div >
        <p>{{model.shouldShow}}</p>
        <div ng-if="!model.shouldShow">
            <button ng-click="model.shouldShow=!model.shouldShow">Hide Section</button>
            <p>{{model.shouldShow}}</p>
        </div>
    </div>
</div>

JS-

function Ctrl($scope) {
    $scope.model={shouldShow:false}
}

同时阅读ng-init的文档。它不应用于任意变量。它的主要目的是在ng-repeat 中对变量进行混叠

DEMO

ng-if的文档解释了发生了什么：

请注意，当使用ngIf移除元素时，其作用域被破坏并且在元素被恢复时创建新的范围。范围在ngIf中创建的使用prototype从其父作用域继承遗产这一点的一个重要含义是，如果使用ngModel在ngIf中绑定到父级中定义的javascript基元范围在这种情况下，对子作用域将覆盖（隐藏）父作用域中的值。

简而言之：一旦在子作用域中修改了shouldShow，它就会覆盖父作用域的shouldShow（原型继承）。正如另一个答案所指出的，这可以通过共享对象wrapperObject.shouldShow间接解决。除非在子作用域中为wrapperObject指定新值，否则它将指向与父作用域相同的实例（因此包含shouldShow的相同实例）。

相关文章：