使用angular来隐藏内部循环中的整个div?

sle*_*cow 6 javascript jquery angularjs ng-repeat ng-show

<div id="whole-div" ng-hide="hideme">
  <div id="loop-div" ng-repeat="i in [1, 2, 3]">
    <button ng-click="hideme=true">Button {{i}}</button> 
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

以上是我现在的代码.我想要它,这样当你点击循环中的一个按钮(Button1,Button2,Button3)时,整个div都被隐藏了.但是,我发现当按钮在外面时,我只能隐藏整个div,如下所示......

<div id="whole-div" ng-hide="hideme">
  <div id="loop-div" ng-repeat="i in [1, 2, 3]">
    <button>Button {{i}}</button> </div>
  <button ng-click="hideme=true">Final Button</button>
</div>
Run Code Online (Sandbox Code Playgroud)

有没有办法使用循环div中的一个内部按钮隐藏整个div?提前致谢!

Cyr*_*don 3

ng-repeat创建一个局部作用域,以便该变量hideme属于该局部作用域。事实上有 3 个变量hideme,每个变量都在一个按钮的范围内。

在 $parent 范围上设置属性应该有效,并且让 hideme 变量对于整个来说是唯一的div

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

app.controller('MainCtrl', function($scope) {

});
Run Code Online (Sandbox Code Playgroud)
<!DOCTYPE html>
<html ng-app="app">

<head>
  <meta charset="utf-8" />
  <script src="https://code.angularjs.org/1.2.28/angular.js"></script>
</head>

<body ng-controller="MainCtrl">
  <!-- here is the scope of MainCtrl, hideme can be used as is -->
  <button ng-click="hideme=false">Show all</button>
  <div id="whole-div" ng-hide="hideme">
    <div id="loop-div" ng-repeat="i in [1, 2, 3]">
      <!-- here is the scope of a button, hideme have to be prefix by $parent to access the right property -->
      <button ng-click="$parent.hideme=true">Button {{i}}</button>
    </div>
  </div>
</body>

</html>
Run Code Online (Sandbox Code Playgroud)