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

我不知道 ember 何时停止使用大写字母 (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 Guide 没有引入命名空间路由。

所以我认为最好按照 Ember Guide 的建议（始终使用 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

希望对你有帮助！