javascript - Angular JS ng-if an ng-repeat complex match length is greater than given value? -


i have ng-repeat shows table based on 1 loop, , cell based on different loop:

<tbody>    <tr ng-repeat="r in roles | limitto: 30">      <td>{{r.name}}</td>      <td>         <span ng-repeat="t in users100 | limitto: r.userlimit" ng-if="t.role == r.name"><a href="{{t.id}}">{{t.full_name}}</a></span>          <span ng-if="true"><a href="" ng-click="r.userlimit=500">show all</a></span>      </td>    </tr>  </tbody> 

each row role, first cell shows role's name.

second cell shows results different dataset role in set matches original set's role value. (it repeats span each match r.userlimit, set in json @ 20)

the tag has click sets value of r.userlimit 500, shows users.

my question is, want show link if number of matches initial repeater greater value of r.userlimit (20)

so thought

ng-if="((t.role == r.name).length > r.userlimit)" 

but syntax wrong, since link never shows. what's wrong wih syntax?

you'd need 2 lengths: original array , filtered one:

this how can ng-repeat:

<span ng-repeat="t in shownusers = (users100 | limitto: limit)"> 

or, easier, angular 1.3:

<span ng-repeat="t in users100 | limitto: limit shownusers"> 

then, use 2 ng-if "show all". don't need hack "all" "a high number":

<span ng-show="shownusers.length < users100.length" ng-click="limit = users100.length">    show </span> 

as bonus, can enable "show more" quite easily:

<span ng-show="shownusers.length < users100.length" ng-click="limit = limit + 10">    show more </span> 

edit: there further complexity if results filtered, as alias not suffice. in case, following works (shortening variable names readability):

<span ng-repeat="t in shown = (filtered = (users | filter: {role: r.name}) | limitto: limit)"> 

and then, use shown.length against filtered.length:

<span ng-show="shown.length < filtered.length" ng-click="limit = users.length">    show </span> 

Comments

Popular posts from this blog

google chrome - Developer tools - How to inspect the elements which are added momentarily (by JQuery)? -

angularjs - Showing an empty as first option in select tag -

php - Cloud9 cloud IDE and CakePHP -