Ember.js中的嵌套路由

Question

我有一個余燼應用程序，它需要以下視圖：

---

• 查看已發布的所有評論的一個- /reviews
• 查看用戶個人資料的一個- /users/:id
• 一個查看其他用戶已發布的所有評論- /users/:id/reviews

我正在為第三個奮斗。

這是我的router.js

this.route('reviews', function() {
  this.route('show', { path: "/:id" });
});

this.route('users', function(){
  this.route('show', {path: '/:id'}, function () {
    this.route("reviews", function(){});
  });
});

我的這條路線的templates/users/show/reviews/index.hbs位於templates/users/show/reviews/index.hbs

我的路線是在routes/users/show/reviews/index.js

但是，當我訪問localhost:4200/users/1/reviews ，它顯示了用戶配置文件路徑（ users/:id第二個要點）。 就像完全一樣

如何使此路由與正確的模板和route.js文件一起使用？

Answer 1

您的路線應為：

this.resource('reviews', function() {
  this.route('show', { path: '/:id'})
})

前一種方式意味着您將可以使用以下路線：

/reviews <-資源評論的默認路由index

/reviews/:id <-這是路線show

並且應具有以下文件：

路線-> app/routes/reviews/show.js ， app/routes/reviews/index.js

控制器-> app/controllers/reviews/show.js ， app/controllers/reviews/index.js

模板-> app/templates/reviews/show.hbs ， app/templates/reviews/index.hbs

請注意，如果您未定義任何先前的文件，則ember默認情況下將生成一個。

對於用戶，應遵循與先前定義相同的邏輯。

this.resource('users', function() {
  this.resource('user', { path: '/:id' }, function () {
    this.route("reviews");
   });
});

為用戶翻譯先前的定義，您將遵循以下路線。

/users <-資源用戶的默認索引

/users/:id <-資源用戶的默認索引

/users/:id/reviews <- users內部的reviews路線

希望對你有幫助！