angular我只能在'ng-if`上设置'true`但我不能设置`false'

我正在尝试使用它ng-if来打开和关闭.

我只能将值设置true为显示孩子,但我无法将值设置回false.

这是我的代码:

var app = angular.module('plunker', []);

var array = [{'name':'one'}, {'name':'two'}, {'name':'three'}];

app.controller('MainCtrl', function($scope) {
    $scope.names = array;
    $scope.showChild = function ( obj ) {
        obj.show = true;
    }
    $scope.closeChild = function ( n ) {
        n.show = false;
    }
});

HTML:

    

        {{n.name}}
        

            {{n.name | uppercase }}
        
 
        
            Close
        
    

现场演示

事件冒泡(事件向上传播)如何工作.

基本上发生这种情况,父元素和子元素都有click与它们有关的事件.当你单击内部元素时,它首先调用它自己的click事件然后click通过冒泡该事件来调用父元素事件.这就是您当前实现中的问题.因此,您需要通过stopPropagation从closeChild方法调用该事件的方法来停止向上传播事件.要获取事件对象,您需要$event从ng-click方法中传递对象$event.

HTML

     

        {{n.name }} {{n}}
        
{{n.name | uppercase }}
 
        Close
    

码

$scope.closeChild = function(event, n) {
    event.stopPropagation();
    n.show = false;
}

演示Plunkr