Ember.js技术问题：如何在控制器中获取URL传递的路由参数

嘿，这个问题我太熟悉了！在Ember.js开发里，控制器要获取URL里的路由参数，其实有几种实用的方式，尤其是你提到的edit路由拿:id的场景，我给你拆解清楚：

这是最常用的方式，毕竟大多数时候你拿到:id参数后，都会用它去请求对应的数据。路由的model钩子会自动接收URL里的动态参数，你可以把参数（或者包含参数的模型数据）返回，控制器就能直接访问。

举个edit路由的例子：

// app/routes/edit.js
import Route from '@ember/routing/route';

export default class EditRoute extends Route {
  model(params) {
    // params对象里就包含了URL中的:id参数
    // 这里可以结合你的业务逻辑，比如用id请求后端数据
    return this.store.findRecord('post', params.id);
    // 如果只是单纯要传递id，也可以返回{ id: params.id }
  }
}

对应的控制器里，你可以直接通过this.model（非Octane版本）或者@model（Octane及以上）访问参数：

// app/controllers/edit.js
import Controller from '@ember/controller';

export default class EditController extends Controller {
  // 定义一个计算属性方便使用
  get currentPostId() {
    // 如果你返回的是模型记录，直接取id属性
    return this.model.id;
    // 如果返回的是自定义对象，就用this.model.id
  }
}

如果你不需要通过model钩子传递数据，只是单纯想拿到URL里的参数，用paramsFor方法或者路由服务会更直接。

方式A：使用paramsFor方法 #

这个方法可以直接获取指定路由的参数，在控制器里这么写：

// app/controllers/edit.js
import Controller from '@ember/controller';

export default class EditController extends Controller {
  get currentId() {
    // 传入路由名称，就能拿到对应的参数对象
    return this.paramsFor('edit').id;
  }
}

方式B：通过路由服务访问 #

注入路由服务后，可以获取当前激活路由的参数：

// app/controllers/edit.js
import Controller from '@ember/controller';
import { inject as service } from '@ember/service';

export default class EditController extends Controller {
  @service router;

  get currentId() {
    // 从当前路由的参数中提取id
    return this.router.currentRoute.params.id;
  }
}

• 如果你用的是Ember Octane（3.16+）的模板语法，在模板里也能直接用@model.id或者{{this.paramsFor('edit').id}}访问参数，但你问的是控制器，所以重点放在了控制器的实现上。
• 优先用model钩子传递参数，因为它能和你的数据请求逻辑结合得更紧密；如果只是临时拿参数，paramsFor会更灵活。

内容的提问来源于stack exchange，提问作者Lex Podgorny