Ember 2.2.0 / Ember Data 2.2.0 page-numbers error

[drewclauson]

When migrating to Ember 2.2.0, I get the errors in the browser console. {{page}} and {{totalPages}} output to make sure they are computed correctly

Template:

{{page-numbers currentPage=page totalPages=totalPages showFL=true}}
Page: {{page}} Total:{{totalPages}}

Errors:

no currentPage for page-numbers
no totalPages for page-numbers
no int for currentPage val is undefined
no int for totalPages val is undefined
no int for currentPage val is NaN
no int for totalPages val is NaN
no int for totalPages val is NaN
no int for totalPages val is NaN

Here is the output.

[drewclauson]

Error is thrown on validate.js line 11 FYI

[dstodolny]

Same here

[richmolj]

Confirm this works on Ember 2.1 and breaks in 2.2. I did see that

this.get('currentPage') // undefined
this.get('attrs.currentPage') // works as expected

Could this be a bug in ember itself?

[drewclauson]

Looking at the past documentation, it looks like this.get('attrs.currentPage') is now the proper way to access attributes passed in to a component. However, I can't seem to find where support for it would have been removed from Ember 2.1 to 2.2. I'm doing more research and may open up an issue on emberjs/ember.js.

[drewclauson]

FWIW, it looks like it's an issue with the fact that we're starting to move toward the DDAU paradigm. this.get('attrs.currentPage.value') is now the right way to access attribute values passed into a component and to update them, you do this.get('attrs.currentPage').update(newValue)

So, I'm putting together a quick fork to fix the page-numbers.js file, but I'm only using the paging component and none of the rest of this library, so long term I'll probably create my own paging component.

[drewclauson]

Ok, I've opened up an issue with Ember as I'm not sure if this change was intentional or not. https://github.com/emberjs/ember.js/issues/12713

Here's where the problem lies:

pages-numbers.js:

export default Ember.Component.extend({
  currentPageBinding: "content.page",
  totalPagesBinding: "content.totalPages",

/*...*/
}

When currentPageBinding and totalPagesBinding are commented out, it works fine with Ember 2.2. Thus, I think that it has something to do with content.page and content.totalPages being undefined and they are returned from the this.get('currentPage') call instead of the currentPage and totalPages value from the attribute.

[frunjik]

What is the status of this - i am getting the same error ... I am not sure where to set the currentPage and totalPages initial values - i tried in controller and in page-numbers component ... But i cant get it to work

• the referenced fork link above gives 404.

[drewclauson]

I removed my fork. Take a look at my last comment, this is the issue and I'm pretty sure it's in Ember. If you're only ever using the paging component in this library and never passing in a PagedArray, then you could fork it and simply comment out the currentPageBinding and totalPagesBinding and it would work again. However, if you're using more in this library, there's going to have to be more done to fix it, either on the Ember side (if it's a bug or was intentional), or on the library side.

An untested fix might be to change the two lines to something like this:

export default Ember.Component.extend({
  currentPageBinding: Ember.computed(function(){
              if(this.get("content.page")===undefined){
                     return this.get("currentPage");
               }else{
                     return this.get("content.page");
                }
            }),
  totalPagesBinding: Ember.computed(function(){
              if(this.get("content.totalPages")===undefined){
                     return this.get("totalPages");
               }else{
                     return this.get("content.totalPages");
                }
            }),

/*...*/
}

Since I'm only using this component with the currentPage and totalPages option, I opted to move the library's code into my application directly and simply remove the currentPageBinding and totalPagesBinding.

[frunjik]

Ok thx, Could u help a newbie out and show what code you are using to make it all work (including record selection) ? TIA

[richmolj]

If you are only using the component and want to avoid forking the repo, there is an alternative. Instead of using it like this:

{{page-numbers currentPage=currentPage totalPages=totalPages}}

Add a computed property:

paginationContent: Ember.computed('currentPage', 'totalPages', function() {
  return {
    page: this.get('currentPage'),
    totalPages: this.get('totalPages')
  }
});

And pass as content:

{{page-numbers content=paginationContent}}

[mbrakken]

In the interest of more data around this issue, I have an app running Ember 2.3.1 and Ember Data 2.3.3 that does not have this problem. Pagination works as expected.

However, it's currently built with Ember-CLI 1.13.15. I tried upgrading to the most current CLI last night end did encounter this problem.

FWIW, broccoli also choked on my modified page-numbers template with that CLI version.

I've contemplated staging through CLI versions to figure out at what version these errors appear, but I don't know that I'll have time for a while. I assume there have been changes in how addons get included in a build, but IDK.