Angularjs pagination errors

Question

I am trying to integrate an Angular UI pagination directive from here -> http://angular-ui.github.io/bootstrap/#/pagination

The problem is that, when I click on the any of the pagination buttons, I get the following error.

Error: [$compile:nonassign] Expression 'undefined' used with directive 'pagination' is non-assignable!
http://errors.angularjs.org/1.3.0-beta.7/$compile/nonassign?p0=undefined&p1=pagination
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.7/angular.js:78:12
    at parentSet (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.7/angular.js:6618:25)
    at Object.parentValueWatch (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.7/angular.js:6632:23)
    at Scope.$digest (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.7/angular.js:12550:40)
    at Scope.$apply (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.7/angular.js:12823:24)
    at HTMLAnchorElement.<anonymous> (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.7/angular.js:19757:21)
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.7/angular.js:2883:10
    at forEach (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.7/angular.js:327:20)
    at HTMLAnchorElement.eventHandler (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.7/angular.js:2882:5) angular.js:10028
(anonymous function) angular.js:10028
(anonymous function) angular.js:7349
Scope.$digest angular.js:12577
Scope.$apply angular.js:12823
(anonymous function) angular.js:19757
(anonymous function) angular.js:2883
forEach angular.js:327
eventHandler

This is the code for the pagination element:

<pagination total-items="totalItems" max-size="5" ng-model="currentPage" items-per-page="itemsPerPage" ng-change="PageChanged()"></pagination>

This seems like a bug with the directive itself but I am not sure.

this is some kind of alien error msg especially for a beginner like me..Thanks for raising this question ! — Nich
– Nich, Commented Jul 25, 2014 at 3:57

Community · Accepted Answer · 2017-05-23 12:12:54Z

5

Looks like you need to either upgrade to ui-bootstrap-tpls-0.11.0.js, or use the old syntax:

page="currentPage"

See also Pagination in Angular UI Bootstrap throwing "Error: [$compile:nonassign]"

edited May 23, 2017 at 12:12

CommunityBot

11 silver badge

answered May 7, 2014 at 0:44

j.wittwer

9,4973 gold badges32 silver badges32 bronze badges

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

1 Comment

Robbie Smith Over a year ago

bower install angular-bootstrap (if you're using bower). I have a working copy using Angular 1.3.14 and ui-bootstrap 0.12.0

mortsahl · Accepted Answer · 2014-05-07 00:23:38Z

0

You are using Angular 1.3.0-beta.7 -- I wouldn't expect 3rd party directives to work until 1.3 is officially released and the 3rd party directives are updated.

Drop down to the latest official stable release

answered May 7, 2014 at 0:23

mortsahl

5906 silver badges19 bronze badges

Collectives™ on Stack Overflow

Angularjs pagination errors

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related