angularjs - ng-show 不适用于 ng-repeat
angularjs - ng-show not working with ng-repeat
我在 ng-click 中将一个变量设置为 true,但下面的 div 没有显示。我关注了 this post but it looks like it doesnt work in maybe ng-repeat? Here's the plunker: http://plnkr.co/edit/90G1KAx9Fmf2SgRs5gYK?p=preview
angular.module('myAppApp', [])
.controller('MainCtrl', function ($scope) {
$scope.notes = [{
id: 1,
label: 'First Note',
done: false,
someRandom: 31431
}, {
id: 2,
label: 'Second Note',
done: false
}, {
id: 3,
label: 'Finished Third Note',
done: true
}];
$scope.reach= function (id) {
//the assignment below works
//$scope.flag = true;
alert("hello there");
};
});
<div ng-app="myAppApp">
<div ng-controller="MainCtrl">
<div ng-repeat="note in notes">
{{note.id}} - {{note.label}} -
<a href="#" ng-click="flag = true;reach(111);">click me</a>
</div>
<div class="row" id="" ng-show="flag">I'm Here</div>
</div>
</div>
应该是ng-click="$parent.flag = true;reach(111);"
<a href="#" ng-click="flag = true;reach(111);">click me</a>
您的问题不清楚,您可以在 ng-repeat
中使用 ng-repeat,方法是在 ng-repeat
父作用域中维护变量。并使用 ng-repeat
中的 $parent.
注释访问父作用域
<div ng-repeat="note in notes">
{{note.id}} - {{note.label}} -
<a href="#" ng-click="$parent.selected = note.id;reach(111);">click me</a>
<div class="row" id="" ng-show="$parent.selected == note.id">I'm Here</div>
</div>
</div>
我建议你使用ng-init
<div ng-repeat="note in notes" ng-init="parent=$parent">
之后
<a href="#" ng-click="parent.flag = true;reach(111);">click me</a>
请看下面的演示
angular.module('myAppApp', [])
.controller('MainCtrl', function($scope) {
$scope.notes = [{
id: 1,
label: 'First Note',
done: false,
someRandom: 31431
}, {
id: 2,
label: 'Second Note',
done: false
}, {
id: 3,
label: 'Finished Third Note',
done: true
}];
$scope.reach = function(id) {
//$scope.flag = true;
alert("hello there");
};
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body>
<div ng-app="myAppApp">
<div ng-controller="MainCtrl">
<div ng-repeat="note in notes" ng-init="parent=$parent">
{{note.id}} - {{note.label}} -
<a href="#" ng-click="parent.flag = true;reach(111);">click me</a>
</div>
<div class="row" id="" ng-show="flag">I'm Here</div>
</div>
</div>
</body>
我在 ng-click 中将一个变量设置为 true,但下面的 div 没有显示。我关注了 this post but it looks like it doesnt work in maybe ng-repeat? Here's the plunker: http://plnkr.co/edit/90G1KAx9Fmf2SgRs5gYK?p=preview
angular.module('myAppApp', [])
.controller('MainCtrl', function ($scope) {
$scope.notes = [{
id: 1,
label: 'First Note',
done: false,
someRandom: 31431
}, {
id: 2,
label: 'Second Note',
done: false
}, {
id: 3,
label: 'Finished Third Note',
done: true
}];
$scope.reach= function (id) {
//the assignment below works
//$scope.flag = true;
alert("hello there");
};
});
<div ng-app="myAppApp">
<div ng-controller="MainCtrl">
<div ng-repeat="note in notes">
{{note.id}} - {{note.label}} -
<a href="#" ng-click="flag = true;reach(111);">click me</a>
</div>
<div class="row" id="" ng-show="flag">I'm Here</div>
</div>
</div>
应该是ng-click="$parent.flag = true;reach(111);"
<a href="#" ng-click="flag = true;reach(111);">click me</a>
您的问题不清楚,您可以在 ng-repeat
中使用 ng-repeat,方法是在 ng-repeat
父作用域中维护变量。并使用 ng-repeat
$parent.
注释访问父作用域
<div ng-repeat="note in notes">
{{note.id}} - {{note.label}} -
<a href="#" ng-click="$parent.selected = note.id;reach(111);">click me</a>
<div class="row" id="" ng-show="$parent.selected == note.id">I'm Here</div>
</div>
</div>
我建议你使用ng-init
<div ng-repeat="note in notes" ng-init="parent=$parent">
之后
<a href="#" ng-click="parent.flag = true;reach(111);">click me</a>
请看下面的演示
angular.module('myAppApp', [])
.controller('MainCtrl', function($scope) {
$scope.notes = [{
id: 1,
label: 'First Note',
done: false,
someRandom: 31431
}, {
id: 2,
label: 'Second Note',
done: false
}, {
id: 3,
label: 'Finished Third Note',
done: true
}];
$scope.reach = function(id) {
//$scope.flag = true;
alert("hello there");
};
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body>
<div ng-app="myAppApp">
<div ng-controller="MainCtrl">
<div ng-repeat="note in notes" ng-init="parent=$parent">
{{note.id}} - {{note.label}} -
<a href="#" ng-click="parent.flag = true;reach(111);">click me</a>
</div>
<div class="row" id="" ng-show="flag">I'm Here</div>
</div>
</div>
</body>