EmberJS 嵌套动态路由未按预期重定向答案

【问题标题】：EmberJS nested dynamic routes don't redirect as expectedEmberJS 嵌套动态路由未按预期重定向
【发布时间】：2017-12-28 22:35:14
【问题描述】：

使用 Ember 2.17.0，我似乎无法让嵌套在其他动态路由下的路由正确加载。

使用以下文件结构，我希望 stacks 路由加载新页面。

features/instances/
├── edit
│   ├── route.js
│   └── template.hbs
├── index
│   ├── route.js
│   └── template.hbs
├── new
│   ├── route.js
│   └── template.hbs
└── view
    ├── route.js
    ├── stacks
    │   ├── route.js
    │   └── template.hbs
    └── template.hbs

stacks 端点的 URL 类似于 /instances/view/91467053-ba03-33b9-8950-83f0e64b4688/stacks/123456

其中123456 是堆栈模型的ID。但是，当我触发页面上方的链接时，不会重新加载，我仍在view 路线上。如果我将{{outlet}} 标记放入view 模板，stacks 的内容就会在那里呈现。但我希望它在它自己的页面上......

我的路由器.js

Router.map(function () {
  this.route('instances', function () {

    this.route('view', {path: '/view/:instance_id'}, function () {
      this.route('stacks', {path: '/stacks/:stack_id'});
    });

    this.route('edit');
    this.route('new');
    this.route('all');

  });
  this.route('error');
});

我在这里做错了什么？我找不到太多关于 ember 2.0+ 的嵌套动态路由

【问题讨论】：

标签： javascript ember.js

【解决方案1】：

希望我能正确理解您的问题。有两种方法可以做到这一点：

1) 而不是 view/template.hbs 将 HTML 放入 view/index/template.hbs，这样view/stacks/template.hbs 将不共享任何 view 模板代码。

2) 不是将stacks 路由嵌套在view 路由中，而是使用path: '/view/:instance_id/stacks/:stack_id' 拉到instances 路由，然后相应地移动路由/模板文件

【讨论】：

感谢您的回复，RE 选项 1，如果我按照您的建议进行操作，事情会变得很奇怪，因为它们已经是视图路线上方的索引文件夹。所以对我后端的请求变成/instances/e3f61b5a-89e3-3d1c-a3ce-e0df22817a9b而不是/instances/view/e3f61b5a-89e3-3d1c-a3ce-e0df22817a9b
在选项 2 之后，我没有收到控制台错误，但页面只是空白。就像 template.hbs 被完全忽略了一样。
后端请求 URL 应该与您的前端路由结构无关。不过，您可能必须显式实现所有模型挂钩。

【解决方案2】：

Ember 中的嵌套路由不像你习惯的那样工作。

在大多数其他视图框架中，嵌套路由意味着对象之间的关系，而在 Ember 中嵌套路由意味着嵌套视图。

因此，例如，如果您希望呈现消息列表并能够在旁边的详细信息窗格中打开它们，则可以有一个 messages.index 路由，该路由嵌套了一个 messages.show 路由。

如果你想渲染一些独立的东西（所以不要嵌套在另一个视图中），只需给它自己的路线。

【讨论】：