Cod*_*oso 6 angularjs angularjs-ng-repeat
我有这个ng-repeat
<tr ng-repeat="website in websites">
<td>{{website.url}}</td>
</tr>
Run Code Online (Sandbox Code Playgroud)
数组中的每个website对象websites如下所示:
{
url: "example.com",
groups: []
}
Run Code Online (Sandbox Code Playgroud)
问题:如何将滤镜应用于上面的循环,以便它只显示groups属性为空数组的元素?
我试过的事情:
data-ng-repeat="website in websites | filter: {groups: []}"
data-ng-repeat="website in websites | filter: !groups.length"
data-ng-repeat="website in websites | filter: groups.length === 0"
Run Code Online (Sandbox Code Playgroud)
(在控制台中没有错误但过滤掉所有内容)
data-ng-repeat="website in websites | filter: {groups: ''}"
Run Code Online (Sandbox Code Playgroud)
(与我想要的相反,只显示groups不是空数组的项目)
data-ng-repeat="website in websites | filter: {groups: null}"
Run Code Online (Sandbox Code Playgroud)
(如果不使用[]我使用null来表示没有值,这可行,但它看起来很麻烦......因为我需要经常注意groups属性变空,并手动将其设置为null)
小智 4
我在控制器中添加了过滤功能:
JS:
angular.module('myApp', [])
.controller('myController', ['$scope',
function($scope) {
$scope.friends = [{
name: 'John', phone: '555-1276', a: [1, 2, 3]
}, { name: 'Mary', phone: '800-BIG-MARY', a: [1, 2, 3]
}, { name: 'Mike', phone: '555-4321', a: null
}, { name: 'Adam', phone: '555-5678', a: []
}, { name: 'Julie', phone: '555-8765', a: []
}, { name: 'Juliette', phone: '555-5678', a: []
}];
$scope.filterFn = function(item) {
// must have array, and array must be empty
return item.a && item.a.length === 0;
};
}
]);
Run Code Online (Sandbox Code Playgroud)
在您的模板中:
<table>
<tr><th>Name</th><th>Phone</th><th>array len</th></tr>
<tr ng-repeat="friend in friends | filter: filterFn">
<td>{{friend.name}}</td>
<td>{{friend.phone}}</td>
<td>{{friend.a.length}}</td>
</tr>
</table>
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
5903 次 |
| 最近记录: |