顯示/隱藏ng-repeat中的項目
[英]Show/Hide items in an ng-repeat
問題描述
使用上面的問題的代碼，我的問題是有一種干凈的方法，能夠刪除每個對象中的所有布爾值，並使角度確定是否顯示/隱藏每個重復的對象。
我有一個項目表，如果您單擊按鈕，它將翻轉一個布爾值並顯示其自身，但是它將對表中的每個項目執行此操作，而不僅僅是單個項，因為它們都指向同一個布爾值。
有沒有一種方法可以為每個項目動態生成布爾值？ 我真的不想在每個對象中添加一個顯示項來調用。 一定有更好的方法。 編輯：這是一個更好的模板用作示例： JSFiddle
的HTML
<body ng-app="task" ng-controller="repeat">
<table class="table table-striped table-hover">
<thead>
<tr>
<td>Account</td>
<td>Details</td>
<td>Secret</td>
<td>Action</td>
</tr>
</thead>
<tbody>
<tr ng-repeat="x in accounts">
<td>{{x.account}}</td>
<td>{{x.details}}</td>
<td><span>{{x.secret}}</span></td>
<td>
<button type="button" class="btn btn-default">Show Secret</button>
</td>
</tr>
</tbody>
</table>
</body>
的JavaScript
var app = angular.module('task', []);
app.controller('repeat', function($scope) {
$scope.accounts = [{
account: "account 01",
details: "lorum ipsum",
secret: 0101101,
}, {
account: "account 02",
details: "lorum ipsum",
secret: 0101101,
}, {
account: "account 03",
details: "lorum ipsum",
secret: 0101101,
}, {
account: "account 04",
details: "lorum ipsum",
secret: 0101101,
}];
});
2 個解決方案
解決方案1
1 已采納 2016-03-09 06:18:40
在您提到的問題中嘗試這種情況
在您的html pass中
<button ng-click="toggle(x.$index)">Hide</button>
在js中
$scope.toggle = function(index){
$scope.array[index].show = !$scope.array[index].show;
};
解決方案2
0 2016-03-09 06:13:36
在按鈕上，調用angularjs函數設置布爾值，然后使用ng-show / ng-hide切換視圖。
在 ng-repeat 中隱藏和顯示
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.