angularjs 필터에 인수 전달

angularjs 필터에 인수 전달

임의의 이름으로 필터링할 수 있도록 인수를 필터 함수에 전달할 수 있습니까?

뭐랄까

$scope.weDontLike = function(item, name) {
    console.log(arguments);
    return item.name != name;
};

실제로 앵글의 네이티브 '필터' 필터를 사용하면서도 인수를 커스텀필터에 전달할 수 있는 (더 나은 솔루션)이 있습니다.

다음 코드를 고려합니다.

<div ng-repeat="group in groups">
    <li ng-repeat="friend in friends | filter:weDontLike(group.enemy.name)">
        <span>{{friend.name}}</span>
    <li>
</div>

이 작업을 수행하려면 필터를 다음과 같이 정의하면 됩니다.

$scope.weDontLike = function(name) {
    return function(friend) {
        return friend.name != name;
    }
}

여기서 볼 수 있듯이 weDontLike는 실제로 필터에서 나오는 원래 항목뿐만 아니라 사용자의 파라미터가 범위에 있는 다른 함수를 반환합니다.

당신이 이것을 할 수 있다는 것을 깨닫기까지 이틀이 걸렸지만, 아직 이 해결책을 본 적이 없습니다.

Checkout angular.js 필터의 역극성을 확인하여 필터로 다른 유용한 작업에 사용할 수 있는 방법을 확인합니다.

필터 함수에는 인수를 전달할 수 없는 것으로 알고 있습니다('필터' 필터를 사용할 경우).커스텀 필터는 다음과 같이 작성해야 합니다.

.filter('weDontLike', function(){

return function(items, name){

    var arrayToReturn = [];        
    for (var i=0; i<items.length; i++){
        if (items[i].name != name) {
            arrayToReturn.push(items[i]);
        }
    }

    return arrayToReturn;
};

여기 jsFiddle이 있습니다.http://jsfiddle.net/pkozlowski_opensource/myr4a/1/

커스텀 필터를 작성하지 않는 다른 간단한 방법은 스코프에 필터링할 이름을 저장한 후 다음과 같이 쓰는 것입니다.

$scope.weDontLike = function(item) {
  return item.name != $scope.name;
};

실제로 파라미터(http://docs.angularjs.org/api/ng.filter:filter )를 전달할 수 있습니다.이것에만 커스텀 함수가 필요한 것은 아닙니다.HTML을 다음과 같이 고쳐 쓰면 동작합니다.

<div ng:app>
 <div ng-controller="HelloCntl">
 <ul>
    <li ng-repeat="friend in friends | filter:{name:'!Adam'}">
        <span>{{friend.name}}</span>
        <span>{{friend.phone}}</span>
    </li>
 </ul>
 </div>
</div>

http://jsfiddle.net/ZfGx4/59/

템플릿에서는 이렇게 간단하게 할 수 있습니다.

<span ng-cloak>{{amount |firstFiler:'firstArgument':'secondArgument' }}</span>

필터 내

angular.module("app")
.filter("firstFiler",function(){

    console.log("filter loads");
    return function(items, firstArgument,secondArgument){
        console.log("item is ",items); // it is value upon which you have to filter
        console.log("firstArgument is ",firstArgument);
        console.log("secondArgument ",secondArgument);

        return "hello";
    }
    });

pkozlowski.opensource 답변을 확장하여 javascript 사용array's내장된 필터 방법은 다음과 같습니다.

.filter('weDontLike', function(){
    return function(items, name){
        return items.filter(function(item) {
            return item.name != name;
        });
    };
});

여기 jsfiddle 링크가 있습니다.

어레이 필터에 대한 자세한 내용은 여기를 참조하십시오.

여러 인수를 각도 필터에 전달할 수 있습니다!

각도 앱 및 앱 수준 변수 정의 -

var app = angular.module('filterApp',[]);
app.value('test_obj', {'TEST' : 'test be check se'});

필터는 다음과 같습니다.

app.filter('testFilter', [ 'test_obj', function(test_obj) {
    function test_filter_function(key, dynamic_data) {
      if(dynamic_data){
        var temp = test_obj[key]; 
        for(var property in dynamic_data){
            temp = temp.replace(property, dynamic_data[property]);
        }
        return temp;
      }
      else{
        return test_obj[key] || key;
      }

    }
    test_filter_function.$stateful = true;
    return test_filter_function;
  }]);

그리고 HTML에서 다음과 같은 데이터를 보냅니다.

<span ng-bind="'TEST' | testFilter: { 'be': val, 'se': value2 }"></span>

여기서 필터에 JSON 개체를 보냅니다.문자열이나 숫자와 같은 모든 종류의 데이터를 전송할 수도 있습니다.

또한 필터에 동적 개수의 인수를 전달할 수 있습니다.이 경우 인수를 사용하여 인수를 취득해야 합니다.

데모가 작동하려면 여기로 이동하십시오 - 여러 인수를 각도 필터에 전달

사용하시면 .| filter:yourFunction:arg

<div ng-repeat="group in groups | filter:weDontLike:group">...</div>

그리고 js에서는

$scope.weDontLike = function(group) {
//here your condition/criteria
return !!group 
}

언급URL : https://stackoverflow.com/questions/11753321/passing-arguments-to-angularjs-filters