Question

我正在尝试过滤一些由海市蜃楼提供并遇到麻烦的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似乎是一个承诺，而不是已解决的承诺的结果。

Answer 1

你应该在＆＃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。

Answer 2

您没有从模型功能中返回数据。这样做。

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，解决模型钩子的所有承诺。

在ember

2 个答案: