Ember路由器命名約定

Question

我需要在ember中嵌套一些路由，我有類似這樣的東西。

this.resource('wizards', { 
    path: '/wizards' 
    }, function() { 
    this.resource('wizards.google', { 
     path: '/google' 
    }, function() { 
     this.resource('wizards.google.register', { 
     path: '/register' 
     }, function() { 
      this.route('step1'); 
      this.route('step2'); 
      this.route('step3'); 
      this.route('summary'); 
     }); 
    }); 
    }); 

我所期待的是作爲結構是這樣的：

url  /wizards/google/register/step1 
route name wizards.google.register.step1 
route  Wizards.Google.Register.Step1Route 
Controller Wizards.Google.Register.Step1Controller 
template wizards/google/register/step1 

，但我得到這個：

url  /wizards/google/register/step1 //as expected 
route name wizards.google.register.step1 //as expected 
route  WizardsGoogle.Register.Step1Route 
Controller WizardsGoogle.Register.Step1Controller 
template wizards/google.register.step1 

不使用資本燼停止（當我不明白的是WizardsGoogle）並開始使用名稱空間（WizardsGoogle.Register）。表面上的不一致使我困惑。我會期待他們中的任何一個。

Answer 1

我遇到了與深嵌套資源相同的事情。雖然我不知道這是怎麼發生的，但我可以告訴你的是，你總是可以使用沒有命名空間的CapitalizedNestedRoute，並且Ember可以識別它。儘管在Ember Inspector中顯示「WizardsGoogle.Register.Step1Route」。

在你的榜樣，我定義這樣的路線：

App = Em.Application.create(); 

App.Router.map(function() { 
    this.resource('wizards', function() { 
    this.resource('wizards.google', function() { 
     this.resource('wizards.google.register', function() { 
     this.route('step1'); 
     this.route('step2'); 
     this.route('step3'); 
     }); 
    }); 
    }); 
}); 

App.IndexRoute = Em.Route.extend({ 
    beforeModel: function() { 
    // Transition to step1 route 
    this.transitionTo('wizards.google.register.step1'); 
    } 
}); 

App.WizardsGoogleRegisterStep1Route = Em.Route.extend({ 
    model: function() { 
    // You can see this alert when you enter index page. 
    alert('a'); 
    } 
}); 

在這個例子中，應用程序將沒有問題過渡到WizardsGoogleRegisterStep1Route。如果你使用的容器來找到這樣的路線：

App.__container__.lookup('route:wizards.google.register.step1').constructor 

它還將顯示App.WizardsGoogleRegisterStep1Route。這與Ember Guide所描述的相同。 http://emberjs.com/guides/routing/defining-your-routes/#toc_nested-resources而Ember指南不會引入命名空間路由。

所以我認爲根據Ember指南的建議（總是使用CapitalizedNestedRoute）會更好。在我看來，定義CapitalizedNestedRoute比nested.namespace.route更容易。

最後，如果你真的想使用命名空間路由/控制器/模板，你可以看看Ember.DefaultResolver。檢查API以瞭解如何擴展它，以便容器可以按照您自己的規則查找模塊。

Answer 2

路由是「命名空間」的內部資源。資源使用你稱之爲大寫字母的地方，它們定義一個名字空間（用於要使用的路線）。

所以這個路由集合：

App.Router.map(function() { 
    this.resource('posts', function() { 
    this.route('new'); 
    this.route('old'); 
    this.route('edit'); 
    this.route('whatever'); 
    }); 
}); 

會導致具有以下名稱路線：

PostsRoute 
PostsNewRoute 
PostsOldRoute 
PostsEditRoute 
PostsWhateverRoute 

然而，下面的一組路線：

App.Router.map(function() { 
    this.resource('posts', function() { 
    this.resource('photos'); 
    this.resource('comments'); 
    this.resource('likes'); 
    this.resource('teets'); 
    }); 
}); 

會導致在路線中使用以下名稱：

PostsRoute 
PhotosRoute 
CommentsRoute 
LikesRoute 
TeetsRoute 

還要注意，資源內的資源沒有得到「命名空間」到「父」的資源，所以你總是曾經有以下形式：

{CapitalizedResourceName}Route // for resources 
{CapitalizedParentResourceName}{RouteName}Route // for routes 

我希望這可以幫助你！