Ember.js中的嵌套路由

Nested routes in Ember.js

本文关键字:嵌套 路由 js Ember      更新时间:2023-09-26

我有一个ember应用程序,它需要以下视图:


  • 一个可以查看您发布的所有评论-/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

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

但当我访问localhost:4200/users/1/reviews时,它显示了用户配置文件路径(users/:id-第二个要点(。就像完全相同的

如何让这个路由使用正确的模板和route.js文件?

您的路线应该是:

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

前面的意思是你将有以下路线可用:

/reviews<-资源评审的默认路线index

/reviews/:id<-这是路线show

并且应该有以下文件:

路线->app/routes/reviews/show.jsapp/routes/reviews/index.js

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

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

请注意,如果您没有定义任何以前的文件,则默认情况下ember将生成一个

对于用户,应遵循与先前定义相同的逻辑。

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

翻译之前的用户定义,你将有以下路线。

/users<-资源用户的默认索引

/users/:id<-资源用户的默认索引

/users/:id/reviews<-usersreviews的路由

希望能帮助你!