programing

Angularjs 필터 네거티브

muds 2023. 10. 23. 22:07
반응형

Angularjs 필터 네거티브

ng-model을 문자열로 사용하여 ng-repeat에 필터링하고 싶은 항목 세트가 있습니다. 지금까지 표현이 무효화되었을 때 작동할 수 있는 방법을 찾지 못했습니다. 다음과 같은 작업을 수행합니다.

<select ng-model="languageOrigin" ng-change="updatePrice()">
             <option ng-repeat="language in languages">{{language}}</option>
</select>
<select ng-model="languageDestination" ng-change="updatePrice()">
            <option ng-repeat="language in languages | filter:!languageOrigin">{{language}}</option>
</select>

설명서에는 !를 사용하여 표현을 부정해야 한다고 나와 있지만 그래도 운이 없습니다.

내가 뭘 잘못하고 있는 거지?

'!' 다음과 같이 필터 문자열 앞에 문자를 붙입니다.

필터:'!'+languageOrigin

<select ng-model="languageOrigin" ng-change="updatePrice()">
  <option ng-repeat="language in languages">{{language}}</option>
</select>
<select ng-model="languageDestination" ng-change="updatePrice()">
  <option ng-repeat="language in languages | filter:'!'+languageOrigin">{{language}}</option>
</select>

개체를 사용하는 경우 다음 항목에도 관심이 있을 수 있습니다.

<li data-ng-repeat="obj in objs | filter:({obj_attr: '!obj_val'})">
   ...
</li>

AngularJS 1.1.5에서 테스트.

업데이트: ENDOH Takanao의 답변 참조.

앵글 보기JS 소스 코드, '!'는 술어 자체가 아닌 술어의 결과를 부정하는 것으로 나타납니다.

var search = function(obj, text){
    if (text.charAt(0) === '!') {
       return !search(obj, text.substr(1));
    }
    switch (typeof obj) {
    ...

따라서 문제를 해결하는 한 가지 방법은 ['!'+myFilter 구문이 마음에 들지 않으면] 컨트롤러에서 자신의 술어 함수를 정의할 수 있습니다.

$scope.inverseOriginFilter = function(item) {
    return item.search($scope.languageOrigin) == -1
}

그런 다음 HTML에 사용합니다.

<select ng-model="languageDestination" ng-change="updatePrice()" 
    ng-options="language for language in languages | filter:inverseOriginFilter">
</select>

솔선수범.

메서드 이름 앞에 '!'을 붙여서 필터링하는 메서드를 사용하는 경우에는 사용할 수 없습니다.대신 다음과 같은 작업을 수행할 수 있습니다.

// You can register this in your AppCtrl if you like, otherwise just use $scope.
$rootScope.not = function(func) {
    return function (item) { 
        return !func(item); 
    }
};

그렇다면 다음을 수행합니다.

filter:not(myFilterMethod)

html에서는 다음과 같이 나타납니다.

<select ng-model="languageDestination" ng-change="updatePrice()">
  <option ng-repeat="language in languages | filter:not(languageOrigin)">{{language}}</option>
</select>

참조 : https://stackoverflow.com/a/17811582/175830

1.3.15를 사용하고 있는데 ENDOH의 솔루션이 작동하지 않았습니다.대신,filter:'!':languageOrigin나를 위해 일했습니다.

$filter 필터를 완전히 제거하기 위해 다음 필터를 추가합니다.

.filter('$nfilter', ['$filter', function($filter) {
    return function() {
        var itemsToExclude = $filter('filter').apply(null, arguments);
        return arguments[0].filter(x => !itemsToExclude.includes(x));
    }
}])

템플릿에서는 다음과 같이 쓸 수 있습니다.

<ui-select-choices repeat="type.id as type in data.types | $nfilter:{id: form.typeId}:true | filter: {label: $select.search}">
    <div ng-bind-html="type.label | highlight: $select.search"></div>
</ui-select-choices>

언급URL : https://stackoverflow.com/questions/13278371/angularjs-filter-negated

반응형