我正在尝试过滤一些由海市蜃楼提供并遇到麻烦的Ember路线中的硬编码数据。
Ember呻吟我的语法(当试图在商店使用filter
时)或当我使用findAll
时它不会返回任何数据然后使用JS过滤器方法对象。
尝试1 - 使用findAll():
路线
export default Ember.Route.extend({
model() {
return {
txSites: this.get('store').findAll('site').filter((site) => {
return site.siteType === 'tx';
})
};
}
});
模板
<select class="form-control">
{{#each model.txSites as |site|}}
<option value="{{site.id}}">{{site.name}}</option>
{{/each}}
</select>
Mirage端点
this.get('/sites', () => {
return {
data: [{
type: 'site',
id: 1,
attributes: {
name: 'London',
siteType: 'tx'
}
},
{
type: 'site',
id: 2,
attributes: {
name: 'Bristol',
siteType: 'rx'
}
}]
}
});
结果
成功请求:GET / sites 对象{data:Array [2]}
但是没有任何内容与下拉列表有关(我没有尝试过滤结果的其他调用工作正常)。
尝试#2:使用filter
:
export default Ember.Route.extend({
model() {
return {
txSites: this.get('store').filter('site', (site) => {
return site.siteType === 'tx';
})
};
}
});
结果
没有调用API
尝试#3:使用过滤器
export default Ember.Route.extend({
model() {
return {
txSites: this.get('store').filter('site', { siteType: 'tx' }, (site) => {
return site.siteType === 'tx';
}).then((results) => { return results })
};
}
});
结果
成功请求:GET / sites?siteType = tx 对象{data:Array [2]}
但没有数据绑定到选择项目。
感觉我在这里遗漏了一些基本的东西。使用ember 2.5和ember数据1.13。
有没有推荐的方法来解决这个问题?
修改
尝试#4 - 使用RSVP哈希查找所有内容:
路线
export default Ember.Route.extend({
model() {
return Ember.RSVP.hash({
oneThing: this.store.findAll('oneThing'),
anotherThing: this.store.findAll('anotherThing'),
txSites: this.store.findAll('site').filter((site) => {
console.log(site);
return site.siteType === 'tx';
})
});
}
});
结果
对oneThing
和anotherThing
的调用都正常,但txSites
没有。
作为进一步的测试,我从.filter
属性中删除了txSites
,这很高兴地返回整个数据集并且绑定正常(因此我很高兴它是导致过滤器的原因)问题和绑定都没问题。)
尝试#5
路线
export default Ember.Route.extend({
model() {
return Ember.RSVP.hash({
oneThing: this.store.findAll('oneThing'),
anotherThing: this.store.findAll('anotherThing'),
txSites: this.store.findAll('site')
.then(results => results.filter((site) => {
return site.siteType === 'tx';
}))
});
}
});
结果
没有数据返回,控制台记录过滤器中的site
似乎是一个承诺,而不是已解决的承诺的结果。
答案 0 :(得分:6)
你应该在&#39; findAll&#39;之后过滤。承诺解决,像这样:
model() {
return Ember.RSVP.hash({
oneThing: this.store.findAll('oneThing'),
anotherThing: this.store.findAll('anotherThing'),
txSites: this.store.findAll('site')
.then(results => results.filter((site) => {
return site.get('siteType') === 'tx';
});
});
}
同样在海市蜃楼中你应该使用虚线值,所以&#39;网站类型&#39;而不是siteType。
答案 1 :(得分:0)
您没有从模型功能中返回数据。这样做。
model(){
return this.get('store').findAll('site').filter((site) => {
return site.siteType === 'tx';
});
}
然后在模板中使用它:
{{#each model as |site|}}
更新
我建议您查询商店:
this.store.query('site', { filter: { siteType: 'tx' } });
UPDATE2:
你可以在afterModel
钩子内过滤txSites,解决模型钩子的所有承诺。