Question

我正在与Ember合作开发移动应用程序。我想尽可能地提高用户体验，并尝试考虑在移动设备上连接并不总是那么好，这就是为什么我想利用加载微调器来加载路由。不幸的是，在一个案例中，它的行为并不像我期望的那样：

在我的嵌套路线设置中：

UserRoute:
   UserIndexRoute (=Profile)
   UserFriendsRoute

在UserRoute上我只加载用户的小版本（=不同型号）。在95％的情况下，当我想在那里导航时，这个模型已经加载了。在Subroutes中（例如UserIndexRoute和UserFriendsRoute，我只需要完整的用户。

我想要实现的是在导航到例如导航时直接渲染UserRoute及其模板。 UserIndexRoute然后在索引部分的出口我希望呈现UserLoadingView。但渲染始终等待所有承诺得到解决，并且永远不会显示UserLoadingView。

如何强制Ember在插座中呈现UserRoute然后再显示UserLoadingView，直到解析UserIndexRoute模型？

我是如何实现的：

afterModel: function(model, transition){
    var _this = this,
        params = Ember.get(transition, 'params.user');
    this.get('store').find('user', params.user_id).then(function(user){
        _this.transitionTo('user.profile', user);
    });
}

Answer 1

不要使用索引路由来获取完整模型，只需将其用作重定向方法即可。

做这样的事情：

UserRoute:
   UserIndexRoute
   UserFooIndexRoute (=Profile) (Naming is up to you)
   UserFriendsRoute

然后连接索引路径以获取完整模型并在完成获取模型后转换到FooIndex，这取决于它是具有动态段（:id）的路径。

App.UserIndexRoute = Em.Route.extend({
  redirect: function(){
    var self = this;
    fetchTheFullModel.then(function(model){
      self.transitionTo('user.fooIndex', model); 
    }
  }
});

如果不是这样，您可以在转换和页面完成渲染后转换到其他路径。

App.UserIndexRoute = Em.Route.extend({
  redirect: function(model, transition) {
    var self = this;
    transition.then(function(){
      Ember.run.scheduleOnce('afterRender', function(){
        self.transitionTo('user.fooIndex');
      });  
    });
  }
});

http://emberjs.jsbin.com/zohav/1/edit

您可以在此处了解有关转移承诺的更多信息，以及afterRender Ember transition & rendering complete event

在嵌套路由层次结构中加载路由

1 个答案: