Ember.js 1.13 nothing displayed on #each even though I can see it on the Ember Inspector

Ember Data
1

After searching for hours, it seems that I could not find a proper answer for this issue… In summary, I have Rails for the backend with Active model Serializer gem that works with JSON to serve Ember.js through Ember-data. What baffles me is that I can see the actual Data from Ember Data on the Ember Inspector, but nothing comes up for the #each code that I have under partials nor from the index page. You can see the issue in the picture below:

Imgur

I have the following versions:

Ember Rails gem = 0.18.2

Ember.js = 1.13.0

Ember Data = 1.13.2

Jquery = 1.11.2

Rails = 4.2

Active Model Serializer gem = 0.9.3

I do not have any compilation issues, but I do have two deprecations left which I could not find instructions in how to deal with them:

  1. The default behavior of shouldReloadAll will change in Ember Data 2.0 to always return false when there is at least one “category” record in the store. If you would like to preserve the current behavior please override shouldReloadAll in you adapter:application and return true.
  2. Your custom serializer uses the old version of the Serializer API, with extract hooks. Please upgrade your serializers to the new Serializer API using normalizeResponse hooks instead. Apparently this deprecation is raised by each #each attempt since I have 4 of them.

If these deprecations sounds like the culprit, then can someone pinpoint me in the right direction to fix them?

On the other hand, below is one my #each code that may have something in which I may have missed:

<ul>
  {{#each factTypes as |factType|}}
  <li><button{{action "selectFactType" factType}}>{{factType.factName}}</button></li>
  {{/each}}
</ul>

Let me know if you need any other specific information, otherwise feel free to play around with the entire project at https://github.com/Deovandski/Fakktion.

2

Couple questions:

What happens when you put

{{factTypes.length}} in your template? You see a number greater than zero?

If not there is something wrong getting the data for factTypes

If the number is greater than zero then what happens when you try

{{#each factTypes key="@index" as |factType|}}

or

{{#each factTypes key="@identity" as |factType|}}

or

{{#each factTypes key="@guid" as |factType|}}
3

Also make sure you are on Ember JS 1.13.2 (or 1.13.3 when it comes out) a few bug fixes that might be related.

1 Like
4

Thanks for helping! I tried your previous answer, but what only appears is FactType Length: with the underlying code being <label>FactType Length: {{factTypes.length}}</label>.

Since it did not work, I pushed Ember to the latest version 1.13.2 and it still is not working. On the other hand, I now have another two deprecations:

  1. Ember.reduceComputed is deprecated. Replace it with plain array methods
  2. Ember.View is deprecated. Consult the Deprecations Guide for a migration strategy.

I am really thinking that one of the four deprecations, or the sum of them is causing this issue. I will work on the Ember.View deprecation since it contains migration information, but I will also try to find something about the other three. If anyone has information, or an example implementation for any of them, I would be grateful.

5

Are you extending the ActiveModelSerializer anywhere in your code? If not, could you try Ember Data 1.13.3?

1 Like
6

I am using the DS.ActiveModelAdapter instead of the DS.RESTAdapter. I tried to switch to the DS.RESTAdapter, but an error showed up saying:

Error while processing route: index Unexpected token < SyntaxError: Unexpected token <

The error does not pinpoint to any location, but this is the code that I have for the index route:

  model: function() {
      return Ember.RSVP.hash({
         posts: this.store.findAll('post')
      });
  }

Even though the error shows up and the page is pretty much blank, I can still see the data on the Ember Inspector which tells me that the error is how I am handling the code. Also, I could not upgrade Ember.js from 1.13.2+e1c92c7a to 1.13.3 because it went straight to 2.0.0 and it broke everything. However, i was able to update Ember-Data to 1.13.3 and the results were 244 deprecations with the same problem persisting…

129 Ember.create is deprecate in-favour of Object.create,

111 Ember.keys is deprecated

4 The default behavior of shouldReloadAll will change in Ember Data 2.0 to always return false when there is at least one “genre”, “factType”, “post” and “category” record in the store. If you would like to preserve the current behavior please override shouldReloadAll in you adapter:application and return true.

Strangely enough, the deprecations mentioned earlier stopped showing up. I will start to work through them and I will post the results. Thanks for the assistance!

7

This issue has been resolved!

Thank you wecc and eccegordo!

The solution is to make sure you have Ember and Ember Data with the latest canary versions as they will better pinpoint the proper deprecations on your code.

Also, ActiveModelSerializer version 0.9.3 is working beautifully with my project. This fix will reflect on the Github repo in a few hours.