CODEWITHSUNDEEP
angularjsangular-filters
byrdr
byrdr

Reputation: 5477

Angular.js interpolation in filter parameter

I have a filter on a ng-repeat, which accepts a parameter. It currently works with a string. 

<div ng-repeat="(key, value) in searchData | aboutFilter:'abo'">

Is is possible to use an interpolated value in place of the string?

<div ng-repeat="(key, value) in searchData | aboutFilter:'{{list.api}}'">

Here is my filter:

app.filter('aboutFilter', function() {
return function(items, input) {
    var filtered = [];
    angular.forEach(items, function (value,key) {

      if(key===input){            
        filtered.push(value);
      }
    });
    return filtered;
}
});

Here is the complete template logic:

<ul ng-repeat="list in englishList">

  <a ng-class="{{list.title}}Hide" mobile-search-slide href="/about"><li><p>{{list.title}}</p><i class="fa fa-chevron-right"></i></li></a>

  <ul id="hideMe" ng-class="'hide{{list.title}}'">           
  <div ng-cloak ng-repeat="(key, value) in searchData | aboutFilter:'{{list.api}}'">

   <div ng-repeat="result in value" ng-class-odd="'odd'" ng-class-even="'even'">
     <a ng-href="{{value.title}}/{{result.shortname}}">
       <li>
           <p>{{result.title}}</p><i class="fa fa-chevron-right"></i>
       </li>
     </a>
    </div>  

  </div> 
  </li>
  </ul>
</ul>

Upvotes: 3

Views: 2979

Answers (1)

mohamedrias
mohamedrias

Reputation: 18566

If you want to use some ng-modelfor filter, then you can just use the model name. No need to use {{}} expression.

In your case, it will be :

 <div ng-cloak ng-repeat="(key, value) in searchData | aboutFilter:list.api">

DEMO

Remember in your filter, you are using string comparison. So the filter will check for exact matches.

And also, IN your filter:

You are comparing key with the input list.api. Here key will always be 0,1, etc index. You must be using value there instead of key

Upvotes: 3

Related Questions