EmberJS表单 - 选择字段未发布

时间:2016-08-30 03:12:11

标签: forms ember.js

我正在学习Ember,我正在尝试使用下拉列表构建一个Ember表单。我想发布以下信息:

category: "http://localhost:8000/api/categories/3"
title: "Do this"

Ember实际上发布的是:这个:

{"data":{"attributes":{"title":"Do this now"},"relationships":{"category":{"data":null}},"type":"tasks"}}

该类别的价值未公布,我不确定我缺少什么。我能够列出所有任务并按类别过滤它们,所以我认为模型很好。

/app/models/task.js

import DS from 'ember-data';

export default DS.Model.extend({
  title: DS.attr('string'),
  category: DS.belongsTo('category')
});

/app/routes/tasks/new.js

import Ember from 'ember';

export default Ember.Route.extend({
  model() {
    return Ember.RSVP.hash({
       'task': this.store.createRecord('task'),
       'categories': this.store.findAll('category')
    });
  },
  setupController(controller, model) {
    const categories = model.categories;

    controller.set('categories', categories);
    controller.set('task', model.task);
  },
  actions: {
    saveTask(newTask) {
      newTask.save().then(() => this.transitionTo('tasks'));
    },

    willTransition() {
      this.controller.get('model').rollbackAttributes();
    }
  }
});

/app/templates/tasks/new.hbs

...    
{{category-select
            task=task
            categories=categories
            default=task.category
            value=task.category
            }} 

/app/templates/components/category-select.hbs

{{#each categories as |category|}}
  <option value="http://localhost:8000/api/categories/{{category.id}}" selected={{is-equal category.id default.id}}>
    {{category.name}}
  </option>
{{/each}}

0 个答案:

没有答案