Recently, I started to learn Ember-data and I'm writting an application with very custom API. Response from Back-end is in bad format, so i normalize it to JsonApi via method 'normalizeResponse' and everything works good.
The problem appears in moment when I want to see content from response. When I was reading about Ember-data, I learned that if got data (InnerObjects), I will be able to take property from it via. InnerObject.get('some_property'), but it doesnt work for me. If I want 'some_property' I have to write InnerObject.data.someproperty what looks bad in longer path. I used Ember.debug() to see this path and my browser shows me that property '_data' is EmptyObject what is not true. When i click on it, it shows a list of properly content ( look attachment ). Am I doing something wrong ? Am I forget about something or misunderstood Ember-Data? I will be grateful for any help.
IMAGES:
export default DS.Model.extend({
facebook: DS.attr(),
www: DS.attr(),
name: DS.attr(),
street: DS.attr(),
house_number: DS.attr(),
postal_code: DS.attr(),
city: DS.attr(),
province: DS.attr(),
picture: DS.attr(),
x: DS.attr(),
y: DS.attr()
});
//json api serializer
export default ApplicationSerializer.extend({
normalizeArrayResponse(store, primaryModelClass, payload, id, requestType) {
return this._super(store, primaryModelClass, this._normalizeSearch(payload), id, requestType);
},
_normalizeSearch(shops) {
let data = shops.map((obj) => {
return {
type: "search",
id: obj.id_sklep,
attributes: {
facebook: obj.facebook,
www: obj.www,
name: obj.nazwa_sklep,
street: obj.adres_ulica,
house_number: obj.adres_nr_domu,
postal_code: obj.adres_kod,
city: obj.adres_miasto,
province: obj.adres_woj,
picture: obj.zdjecie_sklep,
x: obj.lat,
y: obj.lng
}
};
});
return { data: data } ;
}
});
export default Ember.Service.extend({
getShopsAndServices(pattern) {
return this.get('store').query('search', {
fraza: pattern,
cena_min: 0,
cena_max: 100,
id_kat: 1,
lat: 53,
lng: 18
});
}
}
//Controller action:
searchRequest(pattern) {
return pattern.length > this.MIN_CHARS_FOR_SEARCH ? this.get('search').getShopsAndServices(pattern).then((results) => {
let content = results.get('content').length ? results.get('content') : [];
if (content) {
let foo = content[0];
Ember.Logger.debug(foo)
Ember.Logger.debug(foo._data.name)
Ember.Logger.debug(foo.get('name'))
}
return this.set('content', results.get('content').length ? results.get('content') : []);
}) : this.set('content', []);
},
InnerObject.data.someproperty
=> This is wrong.
InnerObject.get('some_property')
=> this is right.
Update your question with not working code. so that we can identify the issue.
1.query method returns Promise and this will be resolved to DS.RecordArray which extends Ember.ArrayProxy so you can use all the methods available.
2.results.get('content')
- Don't access content
property,
3.You can convert that special array to normal array by results.toArray()
4.You can even use each
helper to iterate it like normal array template which is returned by this this.get('search').getShopsAndServices(pattern)
.