javascript - 父级上的 Ember 双向数据绑定(bind)在重新加载时中断

Question

我是 Ember 新手。这是我的问题:

我有一个项目列表，当单击某个项目时，会在列表旁边显示该项目的详细信息。因此，项目的标题显示在列表、详细信息和输入中，以使项目标题可编辑。

当我从主路线导航到嵌套的、特定于项目的路线时，一切正常:我在输入中进行更改，更改会显示在项目列表以及详细信息部分中。但是，如果我刷新页面——尽管我的所有数据都回来了(即它按预期显示)——当我在输入中进行更改时，它不会更新列表标题，尽管标题在 inscription 中路线可以正确更新。

相关代码如下:

App.Router.map(function() {
    this.resource('inscriptions', function(){
        this.resource('inscription', {path:'/:inscription_id'});
      });
});

App.InscriptionsRoute = Ember.Route.extend({
  model: function(){
    return $.getJSON('javascripts/inscriptions.json')
      .then(function(data){
        return data;
      });
  }
});

App.InscriptionRoute = Ember.Route.extend({
  model: function(params){
    return $.getJSON('javascripts/inscriptions.json')
      .then(function(data){
        return data.findBy("id", params.inscription_id);
      });
  }
});

我错过了什么？

Answer 1

当您导航到该项目(而不是刷新)时，它会通过链接帮助器传递模型，因此它会跳过模型路由。当您刷新时，它会点击每条路线以获得必要的模型。导航路线为您提供相同的铭文实例，而在刷新时您将获取完全不同的实例。

话虽这么说，您希望在子路由中使用相同的铭文实例，并避免再次调用您的服务器。

App.InscriptionsRoute = Ember.Route.extend({
  model: function(){
    return $.getJSON('javascripts/inscriptions.json')
      .then(function(data){
        return data;
      });
  }
});

App.InscriptionRoute = Ember.Route.extend({
  model: function(params){
    return this.modelFor('inscriptions').findBy("id", params.inscription_id);
  }
});

http://emberjs.com/api/classes/Ember.Route.html#method_modelFor