javascript - Can I pass args in the html tag of my custom angular element? -


i using angular 1, have directive being returned element called "store". store element ng-repeat through each object in array of json using store of products.

<div class="list-group">   <div class="list-group-item" ng-repeat="product in store.products">     <h3>{{product.name}} <em class="pull-right">{{product.price | currency}} spaces left: {{product.spots}}</em></h3>   </div> </div> 

this works fine on 1 of pages want angular repeat through of objects. on page though want show same information want show products. example, if key value feature set true.

is there way in tag pass arguments specify want display first 2 elements in array or display if equals key value?

you can use filters in ng-repeat directive:

<div class="list-group">   <div class="list-group-item" ng-repeat="product in store.products | query:feature | limitto:5">     <h3>{{product.name}} <em class="pull-right">{{product.price | currency}} spaces left: {{product.spots}}</em></h3>   </div> </div> 

you can pass arguments custom directives well. define directive, can write:

return {         restrict: 'ea',         scope: {             max: '=',         },         ...         template: '         <div class="list-group">           <div class="list-group-item" ng-repeat="product in store.products | query:feature | limitto:max">             <h3>{{product.name}} <em class="pull-right">{{product.price | currency}} spaces left: {{product.spots}}</em></h3>           </div>         </div>'         }; 

and can write:

<store max="5" /> 

this iterate on first 5 elements in array , display them if feature true.


Comments