Model propertery call another model


Ok so I have the follow API response and I am trying to build an appropriate model for it.


          type: 'providers',
          id: 2,
          attributes: {
            category: "Handy",
            status: true,
            name: "John's Service",
            address: {
              street: "125 DeKalb Pike",
              city: "King of Prussia",
              state: "PA",
              zipcode: "19406"
            phone: "215-555-5555",
            email: ""

So I built two models


export default DS.Model.extend({
  street: DS.attr(),
  city: DS.attr(),
  state: DS.attr(),
  zipcode: DS.attr()


export default DS.Model.extend({
  category: DS.attr(),
  status: DS.attr(),
  name: DS.attr(),
  address: DS.belongsTo('address'),
  phone: DS.attr(),
  email: DS.attr(),
  addressline: Ember.computed('address', function() {
    return this.get('') + ', ' + this.get('address.state') + ' '
      + this.get('address.zipcode');

On my view the address property is empty. What am I doing wrong?


You probably should do this:

addressline: Ember.computed('', 'address.state', function() {
    return `${this.get('')}, ${this.get('address.state')} ${this.get('address.zipcode')}`;

I updated it to use ES6 template strings, but the important part is to actually depend on the properties on the relationship, not the relationship itself on the computed property.


Thank you for the help. I also had to do this to the model that I pass into the view

let record ='provider');
record.address ='address');

return record;


By view, do you mean template? Views have been deprecated in Ember.


Yes, sorry, I meant template