单击时隐藏父元素

Question

学习 Angular JS，尝试一个简单的功能，点击一个元素会隐藏它的父元素。

我的代码：

<div class="form-section" ng-init="visible = true" ng-show="visible">   
     <a class="next" ng-click="$parent.visible = false">NEXT</a>
</div>

但是，当我单击我的<a>标签时没有任何反应。

我的代码基于这个小提琴：http : //jsfiddle.net/oxda3aes/

Answer 1

你不需要 $parent

您正在做的是在所调用的范围内创建一个变量visible并将其设置为 true。因此，更改变量所需要做的就是调用visible $parent不是引用父节点，而是引用父作用域。

<div class="form-section" ng-init="visible = true" ng-show="visible">   
    <a class="next" ng-click="visible = false">NEXT</a>
</div>

http://jsfiddle.net/oxda3aes/25/

这可能会帮助您更好地了解正在发生的事情：http : //jsfiddle.net/oxda3aes/26/

这里我在控制器中声明了可见变量。两者都完成相同的任务。

在这里，我在作用域上有一个函数，该函数在单击时调用，执行相同的操作：http : //jsfiddle.net/oxda3aes/27/