Ember.js 名为w/o params的createRecord未将对象添加到集合中

使用：

• ember-1.0.0-pre.4.js
• ember-data.js版本：11
• 车把-1.0.rc.2.js

请看一看这个说明了所描述的问题

我有一个显示在模板中的项目列表。该模板包含一个linkTo帮助器，让控制器向集合中添加一个项，并在页面上显示为文本输入

将项目添加到集合由控制器完成：

App.TodoItem = DS.Model.extend({
    title: DS.attr('string', { defaultValue: "unknown" })
});

App.Router.map(function () {
    this.resource('todo_items')
});

App.TodoItemsRoute = Em.Route.extend({
    model: function () {
        return App.TodoItem.find();
    }
});

App.TodoItemsController = Em.ArrayController.extend({
    addTodoItem: function () {
        App.TodoItem.createRecord();
    }
});

如果我想在列表中显示新项目，我必须将参数传递到

createRecord

，否则该项目不可见。使用Chrome的检查员可以复制相同的行为，然后可以按如下方式显示该项目：

// Open the jsFiddle http://jsfiddle.net/bazzel/BkFYd/ and select 'result(fiddle.jshell.net) in the inspector, then:
var item = App.TodoItem.createRecord();
// Nothing visible yet.

item.set('title', 'Whatever');
// Now the text input appear with the title as its value.

---

这是预期的行为吗？如果是的话，我在这里遗漏了什么？

我花时间重做了您的示例，我觉得应该用Emberjs正确地完成事情。您更应该确保事务，正确定义您的视图，然后处理所有问题。我认为你应该这样做

• 为textfield定义一个视图，以捕获输入的值或 只需将其绑定到model属性

• 列出项目和向列表中添加新项目应在两个不同的视图中完成，不应混合在一起

---

'是JSFIDLE上示例的工作版本。希望我能通过这个例子帮助您澄清一些问题。

谢谢Ken回答我的问题。在余烬中这样做确实感觉更合适。然而，我仍然认为很难掌握从哪里可以访问哪些对象

你的例子启发我重写我的代码。我还对您的方法做了一些更改：

• 我不确定这是否是最佳实践，我的我不创建

  存储

  实例。相反，我定义了一个

  存储

  类
• TodoItemsNewController的内容是通过调用相应路由上的model属性来设置的
• TodoItemsNewRoute中的renderTemplate只需要outlet键

  <script type="text/x-handlebars">
      {{outlet}}
  </script>
  
  <script type="text/x-handlebars" data-template-name="todo_items">
      {{#linkTo 'todo_items.new'}}Add Todo Item{{/linkTo}}
      <ul>
      {{outlet "addItem"}}
      {{#each controller}}
          <li>
          {{#unless isNew}}
              {{title}}
          {{/unless}}
          </li>
      {{/each}}
      </ul>
  </script>
  
  <script type="text/x-handlebars" data-template-name="todo_items/new">
      {{view Ember.TextField valueBinding="title" placeholder="Enter title"}}
  

更新的示例已打开

欢迎任何评论。

valueBinding=“title”将不起作用，因为模板的上下文是由ember生成的控制器，类型为ember.controller，您需要使用ObjectController。看看

window.App = Em.Application.create();

App.TodoItem = DS.Model.extend({
    title: DS.attr('string')
});

App.TodoItem.FIXTURES = [{
    id: 1,
    title: 'Lorem'
}, {
    id: 2,
    title: 'Ipsum'
}];

App.store = DS.Store.create({
    revision: 11,
    adapter: DS.FixtureAdapter.create()
});

App.Router.map(function () {
    this.resource('todo_items',function(){
      this.route('new');
    })
});

App.IndexRoute = Em.Route.extend({
    redirect: function () {
        this.transitionTo('todo_items');
    }
});

App.TodoItemsRoute = Em.Route.extend({
    model: function () {
        return App.TodoItem.find();
    }
});

App.TodoItemsNewRoute = Em.Route.extend({
    transaction: App.store.transaction(),

    setupController:function(controller) {
        console.info(controller.toString());
        controller.set('content',this.transaction.createRecord(App.TodoItem));
    },

    renderTemplate: function() {
        this.render('addItem',{
            into:'application',
            outlet:'addItem',
        })
    },
    events: {
      addItem: function() {
          this.transaction.commit();
            this.transitionTo('todo_items');
      }
    }
});


App.TodoItemsController = Em.ArrayController.extend();
App.TodoItemsNewController = Em.ObjectController.extend();
App.TextField = Ember.TextField.extend({
    insertNewline: function () {
      this.get('controller').send('addItem')
    }
});

<script type="text/x-handlebars">
    {{outlet}}
</script>

<script type="text/x-handlebars" data-template-name="todo_items">
    {{#linkTo 'todo_items.new'}}Add Todo Item{{/linkTo}}
    <ul>
    {{outlet "addItem"}}
    {{#each controller}}
        <li>
        {{#unless isNew}}
            {{title}}
        {{/unless}}
        </li>
    {{/each}}
    </ul>
</script>

<script type="text/x-handlebars" data-template-name="todo_items/new">
    {{view Ember.TextField valueBinding="title" placeholder="Enter title"}}

window.App = Em.Application.create();

App.TodoItem = DS.Model.extend({
    title: DS.attr('string', {
        defaultValue: "unknown"
    })
});

App.TodoItem.FIXTURES = [{
    id: 1,
    title: 'Lorem'
}, {
    id: 2,
    title: 'Ipsum'
}];

App.Store = DS.Store.extend({
    revision: 11,
    adapter: DS.FixtureAdapter.create()
});

App.Router.map(function() {
    this.resource('todo_items', function() {
        this.route('new');
    });
});

App.IndexRoute = Em.Route.extend({
    redirect: function() {
        this.transitionTo('todo_items');
    }
});

App.TodoItemsRoute = Em.Route.extend({
    model: function() {
        return App.TodoItem.find();
    }
});

App.TodoItemsNewRoute = Em.Route.extend({
    model: function() {
        return App.TodoItem.createRecord();
    },
    renderTemplate: function() {
        this.render({
            outlet: 'addItem'
        });
    }
});

App.TodoItemsNewView = Em.View.extend({
    tagName: 'li'
});