반응형
AngularJS-조건부로 항목을 반환하기 위해 ng-repeat로 사용자 지정 필터를 구성하는 방법
목록 항목을 인쇄하는 ng-repeat가 있습니다. 조건이 참인 경우에만 목록 항목이 인쇄되도록 사용자 지정 필터를 작성하고 싶습니다.
변수가 필터로 전달되지 않는 것처럼 보이는 구조가 잘못된 것 같습니다.
index.php
<div ng-show="userDetails.username" class="nav">
<p>Menu</p>
<li ng-repeat="menuItem in menu | matchAccessLevel:$rootScope.userDetails.accessLevel:menuItem.minAccess | orderBy:'position' ">
<a ng-href="/angular-app/app/{{menuItem.id}}">{{menuItem.name}}</a>
</li>
</div>
app.js
userApp.filter('matchAccessLevel', function() {
return function( item, userAccessLevel, minAccessLevel ) {
if( userAccessLevel >= minAccessLevel ) {
return item;
}
}
});
필터는 배열의 개별 항목에서 작동하지 않으며 전체 배열을 다른 배열로 변환합니다.
userApp.filter('matchAccessLevel', function() {
return function( items, userAccessLevel) {
var filtered = [];
angular.forEach(items, function(item) {
if(userAccessLevel >= item.minAccess) {
filtered.push(item);
}
});
return filtered;
};
});
이 plnkr 보기
** 항상 함수에 대한 인수를 검사하십시오. 값이 무엇인지 항상 분명하지는 않습니다. *
필터 가이드 참조
보다 간결한 솔루션을 위해 Array.filter를 사용할 수 있습니다.
app.filter('matchAccessLevel', function() {
return function( items, userAccessLevel ) {
return items.filter(function(element){
return userAccessLevel >= element.minAccess;
});
}
});
CoffeeScript 애호가 :
userApp.filter 'matchAccessLevel', ->
(items, userAccessLevel) ->
item for item in items when userAccessLevel >= item.minAccess
반응형
'program tip' 카테고리의 다른 글
addChildViewController를 호출 한 후 addSubview를 호출해야합니까? (0) | 2020.12.11 |
---|---|
오늘 시간을 자정으로 설정하는 방법은 무엇입니까? (0) | 2020.12.11 |
Angular, 콘텐츠 유형이 $ http로 전송되지 않음 (0) | 2020.12.11 |
MySQL LEFT JOIN 3 테이블 (0) | 2020.12.11 |
예기치 않은 JavaScript 가능한 반복 (0) | 2020.12.11 |