vendredi 22 juillet 2016

How to load dependencies in Ember Data

I have an application, with 2 models: Team and User. Each team has many users, and only 1 Team Leader. On the Index view for Teams, I want to display the list of Teams, and the name of the Team leader. I can't get the name of the team leader to be displayed. Not sure what's wrong.

User Model:

export default Model.extend({
  firstName: attr(),
  lastName: attr(),
  team: belongsTo('team', { inverse: 'users' }),
  fullName: Ember.computed('firstName', 'lastName', function() {
    return `${this.get('firstName')} ${this.get('lastName')}`;
  })
});

Team Model:

export default Model.extend(Validations, {
  name: attr(),
  shortName: attr(),
  description: attr(),
  teamLeader: belongsTo('user', { inverse: null }),
  users: hasMany('user'),
  specialisationArea: attr(),
  sourceEnergyTeam: attr(),
  isEnergyTeam: Ember.computed('specialisationArea', function(){
    return this.get('specialisationArea') == 101;
  })
});

Team Index Route:

export default Ember.Route.extend({
  model() {
    return this.store.findAll('team');
  }
});

Team List Template:

  
    <tr>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td>Details</td>
    </tr>
  

And this is the mirage configuration:

this.get('/teams', () => {
  return [{
    id : 11,
    type: 'team',
    name: 'Energy',
    description: 'energy desc',
    shortName: 'short',
    teamLeader: 12,
    users: [12],
    energyTeam: true
  }];
});

this.get('/teams/:team_id', () => {
  return {
    id: 11,
    type: 'team',
    name: 'energy',
    description: 'energy desc',
    shortName: 'eg',
    teamLeader: 12,
    users: [12],
    energyTeam: true
  };
});

this.get('/users', () => {
  return [{
    id: 12,
    type: 'user',
    firstName: 'Pedro',
    lastName: 'Alonso',
    team: 11
  }];
});

I'm not sure what's going wrong, but in the network calls I can see that only a call to '/teams' is being triggered. Any ideas?

Thanks




Aucun commentaire:

Enregistrer un commentaire