Data not showing in view after moving to Ember 3.0

[kitsuneyo]

trafficstars

My route for a remote paginated API stopped working when I upgraded to Ember 3.0 today. Ember Inspector shows data is loading, but it doesn't display in the view. Pagination links also show up and load data, but the table that should show the data stays empty.

One error I get is: "DEPRECATION: Usage of content is deprecated, use model instead. [deprecation id: ember-runtime.controller.content-alias]". Maybe this is relevant since I believe 3.0 removes some deprecated things?

Here's the relevant stuff from my route:

model: function(params) {
      params.paramMapping = {
        page: "page[number]",
        perPage: "page[size]",
        total_pages: "total_pages"
      };
      return this.findPaged('user', params);
    },

    perPage: 30,

    queryParams: {
      sort: { replace: true, refreshModel: true },
      search: { replace: true, refreshModel: true },
      filter: { replace: true, refreshModel: true }
    }

Here's the pagination stuff in my controller:

queryParams: ['page', 'perPage', 'sort', 'filter', 'search'],

Here's how I'm using it in my template:

{{#each model as |user|}}
  {{user.username}}
{{/each}}

{{page-numbers content=model}}

Also, if I just put {{model}} in my template I get <(unknown mixin):ember526>. On other routes this is normally something like <DS.RecordArray:ember480>, but maybe this is just how the pagination works.

Am I doing something wrong or is this an issue with ember-cli-pagination? Thanks for any help.

[broerse]

From 2.16 we just found out

this.findPaged().then((content) => this.set('rows', content) shout be this.findPaged().then((contentProxy) => this.set('rows', contentProxy.get('content'))) to fix this.

Not sure this is the final solution but we can check after march 5.

[kitsuneyo]

Thanks @broerse, I'll wait for the next update.

[Dhaulagiri]

I will open a separate issue if this is different from what you are seeing @kitsuneyo, but this addon also breaks in one of our apps in ember 3. This line in the addon triggers an error:

Error: PromiseProxy's promise must be set

[broerse]

@kitsuneyo Are you sure you did't miss to change a Deprecation in your code. Temporary switch back to ember-source 2.18.2 might point you to it.

See this change I had to make to to my Bloggr Example to get it to work.

https://github.com/broerse/ember-cli-blog/commit/5367e7167a6923c2ff1bec28b285b62b021d5ffe

https://github.com/broerse/ember-cli-blog/commit/5e814ae7195d027b3263dbe67e9a139003e1e7b4

[kitsuneyo]

@Dhaulagiri, I haven't seen than error, it may be different.

@broerse, switching back to 2.18.2 makes it work again. I don't have any use of content in my app, all the code related to this pagination is listed in my original post... I may be misunderstanding you, but I don't believe I missed any deprecation.

[broerse]

@kitsuneyo You didn't misunderstood me but was thinking it was something like I had. https://bloggr.exmer.com/ works with 3.0 so it is a bug only with remote. Will pick it up after march 5

[kitsuneyo]

@broerse Thanks, I’ll stay with 2.18 for now.

[brunoocasali]

I'm using my app at the version 3 of ember, and I can't see the data, but it loads correctly (Ember Inspector shows this). Downgrading to version 2.18 as commented do the trick. Just waiting for a real fix! Awesome lib ;D

[alejandrodevs]

A quick fix in ember 3+ would be something like this:

In your controller:

usersPaginator: computed.alias('model'), // this will contain your PagedRemoteArray object.
users: computed.alias('model.content'), // this will contain your records.

In your template:

{{page-numbers content=usersPaginator}}

Would be worth to start thinking how to redesign remote pagination.

[broerse]

@alejandrodevs Happy to share thoughts about a redesign. Maybe adapt some jsonapi standard. My code is still working for local pagination in 3+

https://github.com/broerse/ember-cli-blog/blob/master/app/components/blog-posts.js#L31

[alejandrodevs]

Yes, local pagination is working well. This issue is only happening with remote pagination. I'll be dedicating some time to think about a redesign and I'll let you know my ideas.

[roschaefer]

@alejandrodevs how about putting this "quick fix" in the README and close this?