如何在 ng-repeat 中制作独特的 ng-model
How to make unique ng-model in ng-repeat
我想让每个 test
(ng-model) 像 test1
, test2
在下面的代码中都是唯一的..
<div ng-repeat="item in Array">
<div>{{item.Name}}</div>
<a ng-click="openClose(test)>show/hide</a>
<div ng-show="test">{{item.Des}}</div>
</div>
$scope.openClose = function (modalName) {
$scope[modalName] = $scope[modalName] ? false : true;
}
您可以使用在使用 ng-repeat
时为每个元素获得的 $index
值来维护 show / hide
。
angular.module('app',[]).controller('mainCtrl', function($scope){
$scope.Array = [{Name:'abc'},{Name:'zzz'},{Name:'yyy'},{Name:'xxx'}];
$scope.openClose = function (index) {
if($scope.selectedValue == index){
$scope.selectedValue = -1;
}else{
$scope.selectedValue = index;
}
}
})
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app='app' ng-controller='mainCtrl'>
<div ng-repeat="item in Array">
<div>{{item.Name}}</div>
<a ng-click="openClose($index)">show/hide</a>
<div ng-show='$index === selectedValue'>Hide Show content</div>
</div>
</div>
我想让每个 test
(ng-model) 像 test1
, test2
在下面的代码中都是唯一的..
<div ng-repeat="item in Array">
<div>{{item.Name}}</div>
<a ng-click="openClose(test)>show/hide</a>
<div ng-show="test">{{item.Des}}</div>
</div>
$scope.openClose = function (modalName) {
$scope[modalName] = $scope[modalName] ? false : true;
}
您可以使用在使用 ng-repeat
时为每个元素获得的 $index
值来维护 show / hide
。
angular.module('app',[]).controller('mainCtrl', function($scope){
$scope.Array = [{Name:'abc'},{Name:'zzz'},{Name:'yyy'},{Name:'xxx'}];
$scope.openClose = function (index) {
if($scope.selectedValue == index){
$scope.selectedValue = -1;
}else{
$scope.selectedValue = index;
}
}
})
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app='app' ng-controller='mainCtrl'>
<div ng-repeat="item in Array">
<div>{{item.Name}}</div>
<a ng-click="openClose($index)">show/hide</a>
<div ng-show='$index === selectedValue'>Hide Show content</div>
</div>
</div>