식과 일치하는 경우 angular ng-skip 항목을 건너뜁니다.
기본적으로 식과 일치하는 항목을 ng-repeat에서 생략하도록 각을 말하는 방법을 찾고 있습니다.continue
;
컨트롤러 내:
$scope.players = [{
name_key:'FirstPerson', first_name:'First', last_name:'Person'
}, {
name_key:'SecondPerson', first_name:'Second', last_name:'Person'
}]
이제 템플릿에서 일치하지 않는 모든 사용자를 표시하려고 합니다.name_key='FirstPerson'
필터여야 할 것 같아서 Plunkr를 설정해서 가지고 놀았지만, 아직 운이 없었습니다.플런커 시행
@Maxim Shoustin이 제안했듯이 원하는 것을 달성하는 가장 좋은 방법은 커스텀필터를 사용하는 것입니다.
하지만 다른 방법이 있습니다. 그 중 하나는,ng-if
같은 요소에 대한 지시문입니다.ng-repeat
directive(또, 여기 플런커가 있습니다):
<ul>
<li ng-repeat="player in players" ng-if="player.name_key!='FirstPerson'"></li>
</ul>
이는 통계학적 관점에서는 사소한 단점을 나타낼 수 있지만 필터링이 이 규칙과 밀접하게 결합되지 않은 규칙에 기반할 수 있다는 큰 장점이 있습니다.players
앱 범위 내의 다른 데이터에 쉽게 액세스할 수 있는 어레이:
<li
ng-repeat="player in players"
ng-if="app.loggedIn && player.name != user.name"
></li>
갱신하다
전술한 바와 같이, 이것은 이러한 종류의 문제에 대한 해결책 중 하나이며, 고객의 요구에 부합하지 않을 수도 있습니다.
댓글에 지적된 것처럼ng-if
명령어입니다.즉, 백그라운드에서 예상보다 많은 작업을 수행할 수 있습니다.
예를들면,ng-if
부모로부터 새로운 스코프를 작성합니다.
ngIf 내에서 생성된 범위는 프로토타입 상속을 사용하여 상위 범위에서 상속됩니다.
이것은 통상적인 동작에는 영향을 주지 않습니다만, 예기치 않은 경우를 방지하기 위해서, 실장 전에 이 점에 주의해 주세요.
오래된 방법인 것은 알지만, 다른 방법을 찾는 사람이 있을 경우에 대비하여 표준 필터 기능을 사용하여 이 문제를 해결하는 다른 방법이 있습니다.
개체: 패턴 개체를 사용하여 배열에 포함된 개체의 특정 속성을 필터링할 수 있습니다.예를 들어 {name:"M"} 술어는 "M"이 포함된 속성 이름과 "1"이 포함된 속성 전화기의 배열을 반환합니다. ...문자열 앞에 !를 붙이면 술어를 비활성화할 수 있습니다.예를 들어 {name: "!M"} 술어는 속성 이름에 "M"이 포함되지 않은 항목의 배열을 반환합니다.
TS의 예에서는, 다음과 같은 것이 필요합니다.
<ul>
<li ng-repeat="player in players | filter: { name_key: '!FirstPerson' }"></li>
</ul>
필터를 쓸, 「필터나 「를 사용할 필요도 .ng-if
새로운 범위로.
구현 시 사용자 정의 필터를 사용할 수 있습니다.ng-repeat
를 들면 를를: :
data-ng-repeat="player in players | myfilter:search.name
myfilter.js
:
app.filter('myfilter', function() {
return function( items, name) {
var filtered = [];
angular.forEach(items, function(item) {
if(name == undefined || name == ''){
filtered.push(item);
}
/* only if you want start With*/
// else if(item.name_key.substring(0, name.length) !== name){
// filtered.push(item);
// }
/* if you want contains*/
// else if(item.name_key.indexOf(name) < 0 ){
// filtered.push(item);
// }
/* if you want match full name*/
else if(item.name_key !== name ){
filtered.push(item);
}
});
return filtered;
};
});
데모
언급URL : https://stackoverflow.com/questions/19783816/angular-ng-repeat-skip-an-item-if-it-matches-expression
'programing' 카테고리의 다른 글
React가 관리하는 자녀가 있는 contentEditable 구성 요소에 대해 경고하는 이유는 무엇입니까? (0) | 2023.04.03 |
---|---|
몽구스.js: 사용자 이름 LIKE 값으로 사용자 검색 (0) | 2023.04.03 |
Woocommerce 변환을 덮어쓰는 방법 (0) | 2023.04.03 |
오라클 Data Pump 내보내기 파일 내의 스키마를 확인하는 방법 (0) | 2023.04.03 |
Python을 사용하여 JSON 데이터를 파일로 예쁘게 인쇄 (0) | 2023.04.03 |