Angular JS Directive with ng-class

Question

I have a pagination links directive,

app.directive('postsPagination', function(){  
return{
  restrict: 'E',
  template: '<ul class="pagination" ng-show="totalPages > 1">'+
    '<li ng-class="disabled: currentPage!=1"><a href="javascript:void(0)" ng-click="getPosts(1)">&laquo;</a></li>'+
    '<li><a href="javascript:void(0)" ng-click="getPosts(currentPage-1)">&lsaquo; Prev</a></li>'+
    '<li ng-repeat="i in range" ng-class="{active : currentPage == i}">'+
        '<a href="javascript:void(0)" ng-click="getPosts(i)">{{i}}</a>'+
    '</li>'+
    '<li ng-show="currentPage != totalPages"><a href="javascript:void(0)" ng-click="getPosts(currentPage+1)">Next &rsaquo;</a></li>'+
    '<li ng-show="currentPage != totalPages"><a href="javascript:void(0)" ng-click="getPosts(totalPages)">&raquo;</a></li>'+
  '</ul>'
};
});

The ng-class is not working when the value of current page is not equel to 1.

<li ng-class="disabled: currentPage!=1"><a href="javascript:void(0)" ng-click="getPosts(1)">&laquo;</a></li>'+

This is the error.

How can I solve this issue ?

is the name of your class is disabled ? what are you trying to achieve ? — Doruk
– Doruk, Commented Nov 7, 2016 at 6:38
try wrapping the code in {} like ng-class="{disabled: currentPage!=1}" — Doruk
– Doruk, Commented Nov 7, 2016 at 6:41

Doruk · Accepted Answer · 2016-11-07 06:57:30Z

1

Try wrapping the code in {} like:

ng-class="{disabled: currentPage!=1}"

answered Nov 7, 2016 at 6:57

Doruk

9129 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular JS Directive with ng-class

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related