javascript - Ember-charts 导致无法在对象上找到属性 'pie-chart'

标签 javascript ember.js ember-data ember-charts

我正在使用 Ember.js,我的 Bower.json 文件是:

{
  "name": "stats-front-end",
  "dependencies": {
    "handlebars": "~1.3.0",
    "jquery": "~2.1.1",
    "ember": "1.8.1",
    "ember-data": "1.0.0-beta.12",
    "ember-resolver": "~0.1.10",
    "loader.js": "stefanpenner/loader.js#1.0.1",
    "ember-cli-shims": "stefanpenner/ember-cli-shims#0.0.3",
    "ember-cli-test-loader": "rwjblue/ember-cli-test-loader#0.0.4",
    "ember-load-initializers": "stefanpenner/ember-load-initializers#0.0.2",
    "ember-qunit": "0.1.8",
    "ember-qunit-notifications": "0.0.4",
    "qunit": "~1.15.0",
    "ember-charts": "~0.3.0"
  }
}

我正在尝试在 app/templates/languages/index.hbs View 中显示饼图,如图 hereapp/templates/languages/index.hbs 目前是这样的:

<ul>
  {{#each}}
    <li> {{name}} {{occurences}}</li>
  {{else}}
    <li>No language found.</li>
  {{/each}}
</ul>

<div class="chart-container">
  {{pie-chart data=content}}
</div>

如果我删除图表,我的 #each block 会呈现良好(从 ember-data 中提取)。但是,当我使用位于 app/controllers/languages/index.js 的 Controller 来装饰 View 时,即使没有从 ember 数据中提取数据,我也什么也得不到。

app/controllers/languages/index.js

import Ember from 'ember';

export default Ember.ArrayController.extend({
  content: [
    {
      "label": "Equity",
      "value": 12935781.176999997
    },
    {
      "label": "Real Assets",
      "value": 10475849.276172025
    },
    {
      "label": "Fixed Income",
      "value": 8231078.16438347
    },
    {
      "label": "Cash & Cash Equivalent",
      "value": 5403418.115000006
    },
    {
      "label": "Hedge Fund",
      "value": 1621341.246006786
    },
    {
      "label": "Private Equity",
      "value": 1574677.59
    }
    ]
});

控制台读取:

Uncaught Error: <stats-front-end@view:default::ember426> Handlebars error: Could not find property 'pie-chart' on object <stats-front-end@controller:languages/index::ember418>.

我尝试了各种语法来将饼图放入 View 中,但没有成功。理想情况下,我想根据 ember-data 中的内容构建饼图,但此时只需渲染一些内容就很好了。

该项目已开源,发现here

最佳答案

目前 Ember-Charts 代码未包含在您构建的 dist\assets\vendor.js 文件中。在 ember-cli 中安装 Bower 包并不意味着安装的包的代码将包含在您的应用程序中。 Ember 根本找不到 pie-chart 组件,因此它会查找 pie-chart 作为 Controller 上的属性。 您应该将以下代码添加到 Brocfile.js 中:

app.import('bower_components/ember-charts/dist/ember-charts.js');
app.import('bower_components/ember-charts/dist/ember-charts.css');

关于javascript - Ember-charts 导致无法在对象上找到属性 'pie-chart',我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27335612/

相关文章:

ember.js - Ember + Ember 数据: How to rollback a record after calling deleteRecord()

javascript - 如何从 OnChange 调用 Play 框架 Action

javascript - FancyBox 的 iframe 在 Chrome 中工作,但在 IE 或 FireFox 中不起作用

javascript - jquery ajax返回属性问题

javascript - EmberJS Action - 当包装在 `actions` 中时从另一个 Action 调用一个 Action

ember.js - 使用 Ember 保存不成功时显示错误

ember.js - 在 Ember 中通过 ID 获取元素

javascript - 无法在 LocalStorage 中保留单选按钮值

javascript - 重新计算 arrangedContent

javascript - Ember 应用程序请求 Rails 应用程序——跨域?