Ember JS 路由旧数据在新数据加载之前短暂可见

Question

我的问题是，当用户访问我的路由簿/:id/:version 时，需要一些时间来拉取 JSON，并且很快它仍然会呈现旧数据，然后用新数据替换它。

这是我的路线：

App.BookRoute = Ember.Route.extend({
    setupController: function (controller, model) {

        // This gets the entire JSON for the single book
        Ember.$.getJSON('/book?id=' + model.id + '&version=' + model.version,
            function (data) {

                // Set the json to the model
                controller.set('model', data);

            });

    }
});

这是我的路由器：

App.Router.map(function () {
    // Homepage (All the books)
    this.resource('index', { path: '/' });


    // Single Book view
    this.resource('book', { path: '/book/:id/:version' });

});

例如，在第一次访问 #/book/2/1 时，它运行良好。下次访问另一本书#/book/3/1，它将快速显示#/book/2/1 的数据（呈现的html 模板），然后加载#/book/3/1 的数据.

用户离开后如何清除视图？或者如何使它不在路线/视图中显示以前加载的书。

谢谢。

编辑（添加了可能的相关问题）：

我还有另一个问题，可能相关也可能不相关，但在将实际 HTML 呈现到 DOM 之前调用了 didInsertElement 事件。我认为这个方法是在 HTML 渲染到 DOM 之后调用的。

这是视图：

App.BookView = Ember.View.extend({
    didInsertElement: function () {
        console.log('inside didInsertElement');
    }
});

Answer 1

这听起来像是因为您在设置控制器挂钩中执行此操作。获取这样的数据应该在你的模型钩子中完成。本指南告诉您如何操作，请参阅“动态路由”部分：http://emberjs.com/guides/routing/specifying-a-routes-model/

尝试这样做

App.Router.map(function () {
// Homepage (All the books)
   this.resource('index', { path: '/' });


// Single Book view
   this.resource('book', { path: '/book/:book_id/:version' });

});

App.BookRoute = Ember.Route.extend({
  model: function(params) {
  return Ember.$.getJSON('/book?id=' + params.book_id + '&version=' + params.version);
 }
});

我实际上认为 :id 作为参数是保留的，因为建议做类似:book_id