Question

我已经jsbin说明了我的问题。

绑定似乎是在itemController中定义的带有lastname属性的KO，并且我的items循环中没有更新fullname值。

我做错了什么？

Answer 1

列表中项目的控制器与编辑属性lastname的控制器不同，因此永远不会更新。必须将属性lastname指定为模型的属性（如果使用Ember数据，您只是不使用DS.attr并且它不会被保留）。如果您使用自定义库进行数据持久化，则必须手动删除lastname属性。您可以使用Ember Inspector扩展来查看单击项目时有5个控制器。列表中的每个项目都有4个，单击时会生成一个项目。您为第五个控制器编辑属性lastname。要解决这个问题，您可以使用： JavaScript的：

App = Ember.Application.create();

App.Router.map(function() {
 this.resource('items', function() {
   this.resource('item', {path: '/:item_id'});
 });
});

App.Model = Ember.Object.extend({
   firstname: 'foo',
   lastname: 'bar',
   fullname: function() {
     return this.get('firstname') + ' ' + this.get('lastname');
   }.property('firstname', 'lastname')
});

App.ItemsRoute = Ember.Route.extend({
  model: function() {
    return [App.Model.create({id: 1}), App.Model.create({id: 2}), App.Model.create({id: 3}), App.Model.create({id: 4})];
  }
});

App.ItemRoute = Ember.Route.extend({
  model: function(params) {
    return this.modelFor('items').findBy('id', +params.item_id);
  }
});

模板：

  <script type="text/x-handlebars">
    <h2>Welcome to Ember.js</h2>
    {{link-to "items" "items"}}
    {{outlet}}
  </script>

  <script type="text/x-handlebars" data-template-name="items">
    <ul>
    {{#each item in model}}
      <li>
        {{#link-to 'item' item.id}}
        {{item.fullname}} {{item.id}}
        {{/link-to}}
      </li>
    {{/each}}
    </ul>

    {{outlet}}
  </script>

   <script type="text/x-handlebars" data-template-name="item">
     {{input value=model.firstname}}
      {{input value=model.lastname}}
      {{model.fullname}}
  </script>

请注意，我们不建议ArrayController和ObjectController使用，因为将来会弃用它们。 Demo.

Emberjs itemController / controller属性绑定

1 个答案: