Question

我现在有一个非常简单的设置。我有一个书名模型，有一个名字和作者。我正在尝试创建一个可以创建新书的简单表单。对于作者，我使用power select来加载作者模型中的作者。表单设置如下所示：

<form {{action "save" on="submit"}}>
    {{input value=model.title placeholder="Title"}}<br>

    {{#power-select class="select"
        selected=model.author
        options=authors
        onchange=(action (mut model.author)) as |author|}}
        {{author.name}}
    {{/power-select}}

    <input type="submit" value="Save">
</form>

但是，我无法设置路线以使其正常工作。到目前为止，即使作者存储在我的数据库中，也没有作者出现在选择中。我的路线看起来像这样：

import Ember from 'ember';

export default Ember.Route.extend({
    model() {
        return this.store.createRecord('book');
    },
    actions: {
        save() {
            this.modelFor(this.routeName).save();
        }
    },

    store: Ember.inject.service(),
    authors: Ember.computed({
        get() {
            return this.get('store').findAll('author');
        }
    }).readOnly()
});

首先，我应该如何在书籍/新路线的路线中正确加载作者模型中的数据？其次，我应该在路线上这样做吗？根据我的阅读以及人们告诉我的内容，应该在路线中加载模型数据。

Answer 1

将authors属性移动到相应的控制器。

此外，您无需添加readonly。

所以在控制器中：

  authors: Ember.computed(function(){
                return this.get('store').findAll('author');        
})

用于在路线中加载模型。是的，您应该加载该模型，该模型是路由中的资源操作。所以现在你做得对。

Answer 2

1）在路径模型钩子中使用Ember.RSVP.hash

您的路线档案 - ＆gt;我假设books / new.js

import Ember from 'ember';

export default Ember.Route.extend({
    model() {
        return Ember.RSVP.hash({
            newBook : this.store.createRecord('book'),
            authors : this.store.findAll('author')          
        });
    },
    actions: {
        save() {
            this.modelFor(this.routeName).newBook.save(); 
        }
    }    
});

在内部模板中，您可以使用authors访问model.authors。使用title

和model.newBook.title

<form {{action "save" on="submit"}}>
    {{input value=model.newBook.title placeholder="Title"}}<br>

    {{#power-select class="select"
        selected=model.newBook.author
        options=model.authors
        onchange=(action (mut model.newBook.author)) as |author|}}
        {{author.name}}
    {{/power-select}}

    <input type="submit" value="Save">
</form>

2）与ebrahim建议的一样，您可以在所需的控制器中使用以下代码，

authors: Ember.computed(function(){
           return this.store.findAll('author');        
})

3）由于作者模型数据将成为作者，书籍，书籍，新路线的共享数据模型。所以你可以保持服务并从所有必需的路线访问它。

authors-service.js - ＆gt;在服务中

import Ember from 'ember';

export default Ember.Service.extend({
  store:Ember.inject.service(),
  authors: undefined,
  init(){
   this._super(...arguments);
   this.get('store').findAll('author', { reload: true }).then(function(results){
        this.set('authors',results); //As this is going to be  Ember.enumerables, you can iterate and get the data.
    });
 }
});

您可以通过注入authors从任何位置访问authors-service.js authorsService:Ember.inject.service()。我想在你的情况下，你需要为books/new.js模板创建控制器books/new.hbs，

books / new.js - ＆gt;控制器文件

import Ember from 'ember';

export default Ember.Controller.extend({  
  authorsService:Ember.inject.service(),
  authors: Ember.computed.alias('authorsService.authors');
});

在books / new.hbs模板中，您可以访问authors属性。

ember - 在电力分拣路线中加载模型数据？

2 个答案: