如何在 ember 2.17 中使用带有多个参数的嵌套路由

据我了解，您还没有很好地设置路由层次结构。

假设你有多个用户，每个用户有多个家庭，每个家庭有多个房间，我建议你router.js是这样的：

Router.map(function() {
  this.route('about');
  this.route('users', function() {
    this.route('index'); // Lists all the users, URL looks like /users
    this.route('single', { path: '/:user_id' }, function() {
      this.route('index'); // Shows a single user, URL looks like /users/123
      this.route('households', function() {
        this.route('index'); // Shows all households a user with user_id has, URL looks like /users/123/households
        this.route('single',{ path: '/:household_id' }, function() {
          this.route('index'); // Shows a single household, URL looks like /users/123/households/456
          this.route('rooms', function() {
            this.route('index'); // Shows all rooms a household with household_id has, URL looks like /users/123/households/456/rooms
            this.route('single', { path: '/:room_id' }); // Shows a single room, URL looks like /users/123/households/456/rooms/789
          });
        });
      });
    });
  });
});

this.route('index');如果您愿意，可以随意省略路由器中的线路，但请确保您制作了一条路线来处理此问题。您的模板应如下所示。

// templates/users.hbs

{{outlet}}


// templates/users/index.hbs

<h1>This shows all the users</h1>

<ul>
{{#each model as |user|}}
  <li>{{user.name}}</li>
{{/each}}
</ul>


// templates/users/single.hbs

{{outlet}}


// templates/users/single/index.hbs

<h1>This shows a single user with id {{model.id}}</h1>

<p>This is the user named {{model.name}}.</p>


// templates/users/single/households.hbs

{{outlet}}


// ... And so on

你应该model()以这样的方式实现钩子，它们只获取你真正需要的东西。对于列表，你获取它们在指数route.js的类型要显示（即model()的routes/users/index.js用户），而对于单个记录未在索引中，但在单route.js（即单个家庭在model()中routes/users/single/households/single.js），以使索引路由和子路由都可以访问该模型。

因此，使用此配置，您的链接应如下所示：

// All users
{{#link-to 'users'}}All users{{/link-to}}

// Single user
{{#link-to 'users.single' user.id}}{{user.name}}{{/link-to}}

// Households of a single user
{{#link-to 'users.single.households' user.id}}All households of {{user.name}}{{/link-to}}

// Specific household of a single user
{{#link-to 'users.single.households.single' user.id household.id}}Household {{household.name}} of {{user.name}}{{/link-to}}

// Rooms within a specific household
{{#link-to 'users.single.households.single.rooms' user.id household.id}}All rooms within household {{household.name}} of {{user.name}}{{/link-to}}

注意：确保正确指定模型及其关系，以便从一开始就让您的生活更轻松。因此，对于本答案开头假设的配置，您应该使模型如下所示：

// models/user.js

import DS from 'ember-data';

export default DS.Model.extend({
    name: DS.attr('string'),

    households: DS.hasMany('household')
});


// models/household.js

import DS from 'ember-data';

export default DS.Model.extend({
    name: DS.attr('string'),

    user: DS.belongsTo('user'),
    rooms: DS.hasMany('room')
});


// models/room.js

import DS from 'ember-data';

export default DS.Model.extend({
    name: DS.attr('string'),

    household: DS.belongsTo('household')
});

如果你像这样组织你的模型，那么 Ember 会让你从房间页面（路由）链接到用户页面，如下所示：

{{#link-to 'users.single' model.household.user}}Go to user{{/link-to}}