[英]How to hide button in ng-repeat in AngularJS?
<div class="col-sm-4 col-xs-4" ng-repeat="(id, object) in objects">
<button type="primary"
ng-click="add(id)"
ng-hide="id.plz" style="color: cyan;">Add</button>
</div>
$scope.add = function(id){
// some function;
$scope.objects[id].plz = true;
}
Any idea why it won't work? 知道为什么它不起作用吗?
<div class="col-sm-4 col-xs-4" ng-repeat="(id, object) in objects">
<button type="primary" ng-hide="objects[id].plz" ng-click="add(id)" style="color: cyan;" >Add</button>
<div>
here in ng-hide="id.plz"
id is the index so there is no id.plz
在ng-hide="id.plz"
id是索引,因此没有id.plz
learn more about ng-hide
and alternatives here 在此处了解有关ng-hide
和替代品的更多信息
If you want to conditionally hide your button in ng-repeat, use ng-hide, ng-show(if there is a chance that you will hide and show it later) or ng-if(if it's a one time hide of button). 如果您想有条件地将按钮隐藏在ng-repeat中,请使用ng-hide,ng-show(如果有可能稍后再隐藏并显示)或ng-if(如果是一次隐藏按钮) 。
ng-hide takes a boolean and shows/displays accordingly. ng-hide采用布尔值并相应地显示/显示。 In your case your ng-hide is always turned out to be true, so you are unable to hide. 就您而言,您的ng-hide总是真实的,因此您无法隐藏。 Just write the condition required in your ng-hide to hide your button 只需在ng-hide中写下所需的条件即可隐藏按钮
Hide the button when its clicked like in this fiddle : 单击该按钮时隐藏按钮,如下所示 :
<div ng-controller="MyCtrl">
<div ng-repeat="user in data">
{{ user.name}}
<button ng-hide="hide[$index]" ng-click="add();hide[$index] = true;">
Add
</button>
</div>
</div>
var myApp = angular.module('myApp',[]);
myApp.controller('MyCtrl', function ($scope) {
$scope.add = function () {
console.log('add');
}
$scope.data = [{
name: 'frank'
},{
name: 'peter'
},{
name: 'melanie'
},{
name: 'sven'
},{
name: 'basti'
},{
name: 'edjuh'
}];
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.