angularjs - 如何使用 ng-click on a li 隐藏它的 ul parent

Question

我有一个列表刷新了我的 li 元素中的结果:

<ul ng-init="visible = true" ng-show="visible">
    <li ng-repeat="suggestion in results" 
        ng-mouseover="changeSearchValue(suggestion)" 
        ng-click="visible = false">
        {{suggestion}}
     </li>
</ul>

我想在单击 li 时隐藏我的列表 (ul)，但我无法使其工作...这是一种糟糕的方法吗？

Answer 1

ng-repeat 为每次迭代创建一个范围，因此 ul 元素中的 visible 变量不一定与每个 li 元素。从 li 元素调用父范围的变量应该修复它:

<ul ng-init="visible = true" ng-show="visible">
    <li ng-repeat="suggestion in results" 
        ng-mouseover="changeSearchValue(suggestion)" 
        ng-click="$parent.visible = false"> <--this is the key
        {{suggestion}}
     </li>
</ul>

您最初编写的内容允许您分别隐藏每个 li 元素。

在这里查看不同之处:http://jsfiddle.net/oxda3aes/