Ember.js控制器如何获取Route中model()方法的返回值？

嘿，刚好对Ember 2.13这块熟，帮你捋捋～首先文档的描述是完全正确的：路由model()方法返回的数据会自动作为model属性注入到对应控制器中，但你直接用this.model访问出错，是因为没遵循Ember的属性管理规则。

为什么this.model会出问题？ #

Ember 2.x的控制器基于Ember.Object，它的属性是通过计算属性系统和getter/setter方法来管理的。直接用this.model访问，要么在控制器初始化完成前还没拿到路由传递的model值，要么因为Ember的属性封装导致无法直接读取，所以控制台会报undefined或属性不存在的错误。

正确的访问方式 #

1. 在控制器方法里获取数据 #

用this.get('model')来读取路由传递的model，这是Ember 2.x的标准写法：

// app/controllers/post.js
import Ember from 'ember';

export default Ember.Controller.extend({
  // 在动作中访问model
  showPostDetail() {
    const post = this.get('model');
    console.log('文章标题：', post.title);
  },

  // 在计算属性中依赖model
  postPreview: Ember.computed('model.content', function() {
    const content = this.get('model.content');
    return content ? content.slice(0, 80) + '...' : '暂无内容';
  })
});

2. 在模板中直接使用 #

模板里不需要用get方法，直接写{{model.xxx}}即可，Ember模板会自动处理属性绑定：

{{!-- app/templates/post.hbs --}}
<h2>{{model.title}}</h2>
<p>{{postPreview}}</p>
<button {{action 'showPostDetail'}}>查看详情</button>

配套路由代码参考 #

确保你的路由正确返回了model数据，控制器才能拿到对应的属性：

// app/routes/post.js
import Ember from 'ember';

export default Ember.Route.extend({
  model(params) {
    // 可以是API请求或静态数据
    return this.store.findRecord('post', params.post_id);
    // 静态数据示例：return { title: '我的第一篇Ember文章', content: '这是文章内容...' };
  }
});

额外小提示 #

• 2.13里虽然还支持ObjectController，但更推荐用普通Controller，两者访问model的方式都是this.get('model')。
• 路由和控制器名称要对应：比如post路由自动匹配post控制器，不用额外配置关联。

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