lundi 31 octobre 2016

Detecting when a hasMany property has been populated with no results

What I'm trying to do seems simple but I can't quite figure out how to do it.

I am using Emberjs 2.8.

I have the following model with an async: true property:

models/my-model.js

import DS from 'ember-data';

export default DS.Model.extend({
  childModels: DS.hasMany('otherModel', {async: true})
});

I have a component that displays one of these models:

/components/my-component.js

import Ember from 'ember';
export default Ember.Component.extend({
   theModel: // model of type my-model here
})

It's possible that my-model.childModels does not have any records. What I would like to do is in the template display a "no children found" message if that is the case but I only want to do this after the async call to the server is made and returned an empty response. So I would want the template to look something like this:

templates/components/my-component.hbs

<div>

   // display message saying there are no children

   
      // do something
   

</div>

The tricky part is knowing if the relationship has already populated from the server. I can't just check for .length == 0 because that is true before the async call is made and I don't want the DOM toggling back and forth unnecessarily. What I need is something like theModel.childModels.isLoaded but after looking through the docs I'm not sure how to accomplish this.

Could anyone suggest a way to do this? Any advice would be appreciated. Thanks much!




Aucun commentaire:

Enregistrer un commentaire