Handlebars 模板不会呈现 ember 数据对象

Question

我构建了一个 ember 前端应用程序，该应用程序使用另一个应用程序中使用 rails 制作的 API。 ember 应用程序成功地从 rails api 请求和接收数据，我的车把模板之一（显示我的毕业生模型中所有毕业生列表的索引页面）是工作正常。然而，旨在显示个别毕业生的页面无法呈现有关这些个别毕业生的数据。尽管当我在浏览器 (Chrome) 的开发人员控制台中打开 ember 工具时，该数据是存在的。

我是 ember 的新手，我已经尝试解决这个问题 2 天了，但我完全被难住了，任何帮助将不胜感激！

app/adapters/application.js:

import DS from 'ember-data';

export default DS.ActiveModelAdapter.extend({
   namespace: 'api/v1',
   host: 'http://localhost:3000'
});

app/models/graduate.js:

import DS from 'ember-data';

export default DS.Model.extend({
  firstName: DS.attr('string'),
  lastName: DS.attr('string'),
  cohort: DS.attr('string'),
  currentJob: DS.attr('string'),
  bio: DS.attr('string'),
  news: DS.attr('string'),
  website: DS.attr('string'),
  picture: DS.attr('string'),
  createdAt: DS.attr('date'),
  updatedAt: DS.attr('date')
  });

routes/graduates/index.js:

import Ember from 'ember';

export default Ember.Route.extend({
   model: function() {
      return this.store.find('graduate');
   }
});

routes/graduate.js:

import Ember from 'ember';

 export default Ember.Route.extend({
    model: function(params) {
       return this.store.find('graduate', params.graduate_id);
    }
 });

app/router.js:

import Ember from 'ember';
import config from './config/environment';

var Router = Ember.Router.extend({
  location: config.locationType
 });

export default Router.map(function() {
   this.resource('graduates', function() {
     this.resource('graduate', { path: '/:graduate_id' });
     });
 });

environment.js:

/* jshint node: true */

module.exports = function(environment) {
  var ENV = {
    contentSecurityPolicy: {
    'connect-src': "'self' http://localhost:3000",
     'default-src': "'none' http://localhost:3000",
     'script-src': "'self'",
     'font-src': "'self' http://localhost:3000",
     'img-src': "'self' http://localhost:3000",
     'style-src': "'self' http://localhost:3000 'unsafe-inline",
     'media-src': "'self' http://localhost:3000"
  },


modulePrefix: 'flatbook-front',
environment: environment,
baseURL: '/',
locationType: 'auto',
EmberENV: {
  FEATURES: {
    // Here you can enable experimental features on an ember canary     
    build
    // e.g. 'with-controller': true
  }
},

 APP: {
  // Here you can pass flags/options to your application instance
  // when it is created
  }
 };

if (environment === 'development') {
  // ENV.APP.LOG_RESOLVER = true;
  // ENV.APP.LOG_ACTIVE_GENERATION = true;
  // ENV.APP.LOG_TRANSITIONS = true;
  // ENV.APP.LOG_TRANSITIONS_INTERNAL = true;
  // ENV.APP.LOG_VIEW_LOOKUPS = true;
}

 if (environment === 'test') {
   // Testem prefers this...
   ENV.baseURL = '/';
   ENV.locationType = 'none';

   // keep test console output quieter
   ENV.APP.LOG_ACTIVE_GENERATION = false;
   ENV.APP.LOG_VIEW_LOOKUPS = false;

   ENV.APP.rootElement = '#ember-testing';
 }

  if (environment === 'production') {

 }

  return ENV;
 };

app/templates/graduate.hbs:

<h1>{{firstName}} {{lastName}}</h1>

Answer 1

应该是

  // app/templates/graduate.hbs
  <h1>{{model.firstName}} {{model.lastName}}</h1>

您的模板

<h1>{{firstName}} {{lastName}}</h1>

显示当前控制器 (class Ember.Controller) 的 firstName 和 lastName 属性，但它们未设置。

在此处查看问题的历史记录：http://emberjs.com/deprecations/v1.x/#toc_objectcontroller。

Handlebars 模板不会呈现 ember 数据对象

Handlebars template won't render ember data object

ruby-on-rails

handlebars.js

ember.js