programing

식과 일치하는 경우 angular ng-skip 항목을 건너뜁니다.

padding 2023. 4. 3. 21:19
반응형

식과 일치하는 경우 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-repeatdirective(또, 여기 플런커가 있습니다):

<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

반응형