Ember.js路由：如何设置默认路由立即呈现？ [英] Ember.js routing: how do you set a default route to render immediately?

问题描述

我相信，当我深入挖掘时，这将变得清晰，但现在不清楚如何使这一切发生。

我正在关注这个有用的SO文章关于路由，但是从示例中缺少一个重要的部分，即如何让home视图立即呈现，而无需单击home链接？

我已经开始挖掘文档来试图理解这一点，但同样对于后代来说似乎是一个有用的问题。

我一直在玩上述问题的工作jsfiddle示例 here 并与其他示例进行比较，我发现似乎默认路由工作

到目前为止还是一个谜。

当前代码：

  App.Router = Em.Router.extend（{
 enableLogging：true，
 location：'hash'，
 
 root：Em.State.extend （{
 // EVENTS 
 goHome：Ember.State.transitionTo（'home'），
 viewProfile：Ember.State.transitionTo（'profile'），
 
 // STATES 
 index：Em.State.extend（{
 route：/，
 redirectsTo：'home'
}），
 
 home：Em.State.extend（{
 route：'/ home'，
 connectOutlets：function（router，context）{
 var appController = router.get（'applicationController'）; 
 appController.connectOutlet（'home'）; 
} 
}），
 
 // STATES 
个人资料：Em.State.extend（{
 route：'/ profile'，
 connectOutlets：function（router，context）{
 var appController = router.get（的ApplicationController）; 
 appController.connectOutlet（'profile'）; 
} 
}），
 doOne：function（）{
 alert（eins）; 
} 
}）
}）; 
  

---

更新：解决方案

事实证明，我正在使用的示例不正常的原因是因为它使用 Em.State.extend 而不是 Em.Route.extend 。有趣的部分是，当我逐步改变它们，一个接一个地改变它们的例子，直到我改变了所有这些结果为止，这个例子不起作用。

这里是工作的< a href =http://jsfiddle.net/fSgZS/ =nofollow noreferrer>示例：

  App.Router = Em.Router.extend（{
 enableLogging：true，
 location：'hash'，
 
 root：Em。 Route.extend（{
 // EVENTS 
 goHome：Ember.State.transitionTo（'home'），
 viewProfile：Ember.State.transitionTo（'profile'），
 
 // STATES 
 index：Em.Route.extend（{
 route：/，
 redirectsTo：'home'
}），
 
 home：Em.Route.extend（{
 route：'/ home'，
 connectOutlets：function（router，context）{
 var appController = router.get（'applicationController '）; 
 appController.connectOutlet（{name：'home'}）; 
} 
}），
 
 // STATES 
个人资料：Em.Route.extend（{
 route：'/ profile'，
 connectOutlets：function路由器，上下文）{
 var appController = router.get（'applicationController'）; 
 appController.connectOutlet（'profile'）; 
} 
}），
 doOne：function（）{
 alert（eins）; 
} 
}）
}）; 
  

解决方案

U可以从索引到家里重定向路线。工作示例：
http://jsfiddle.net/FRfBt/

I'm sure this will become clear as I dig in deeper, but for now it's not obvious how to make this happen.

I was following the info on this helpful SO article about routing but there is an important piece missing from the example, i.e. how do you get the 'home' view to render right away without having to click the 'home' link?

I've started digging into the docs to try to make sense of this, but meanwhile it seems like a useful question to have answered for posterity.

I've been playing with the working jsfiddle example from the above question here and comparing with this other example I found that seems to have the default routing working

So far it's still a mystery.

Current code:

App.Router = Em.Router.extend({
  enableLogging: true,
  location: 'hash',

  root: Em.State.extend({
    // EVENTS
    goHome: Ember.State.transitionTo('home'),
    viewProfile: Ember.State.transitionTo('profile'),

    // STATES
    index: Em.State.extend({
        route: "/",
        redirectsTo: 'home'
    }),

    home: Em.State.extend({
        route: '/home',
        connectOutlets: function(router, context) {
            var appController = router.get('applicationController');
            appController.connectOutlet('home');
        }
    }),

    // STATES
    profile: Em.State.extend({
        route: '/profile',
            connectOutlets: function(router, context) {
              var appController = router.get('applicationController');
              appController.connectOutlet('profile');
            }
        }),
        doOne: function() {
            alert("eins");
        }
  }) 
});

---

UPDATE: Solution

It turns out that the reason the example I was working with was not working was because it was using Em.State.extend rather than Em.Route.extend. The interesting part is that as I step through and change them over one by one the example doesn't work until I change all of them over.

Here is the working example:

App.Router = Em.Router.extend({
  enableLogging: true,
  location: 'hash',

  root: Em.Route.extend({
    // EVENTS
    goHome: Ember.State.transitionTo('home'),
    viewProfile: Ember.State.transitionTo('profile'),

    // STATES
    index: Em.Route.extend({
        route: "/",
        redirectsTo: 'home'
    }),

    home: Em.Route.extend({
        route: '/home',
        connectOutlets: function(router, context) {
            var appController = router.get('applicationController');
            appController.connectOutlet({name: 'home'});
        }
    }),

    // STATES
    profile: Em.Route.extend({
        route: '/profile',
            connectOutlets: function(router, context) {
              var appController = router.get('applicationController');
              appController.connectOutlet('profile');
            }
        }),
        doOne: function() {
            alert("eins");
        }
  }) 
});

解决方案

U can make a redirect from the index to the home route. Working example: http://jsfiddle.net/FRfBt/

这篇关于Ember.js路由：如何设置默认路由立即呈现？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！