node.js - Chartjs 在 Angular2 应用程序中的使用

标签 node.js typescript angular chart.js

我目前正在探索 Angular2 与 TypeScript 的结合,我想在我的应用程序中包含 Chartjs 模块。在 chartjs documentation显示了如何使用常见的 canvas html 标签来做到这一点:

<canvas id="myChart" width="400" height="400"></canvas>
<script>
var ctx = document.getElementById("myChart");
var myChart = new Chart(ctx, {[...]});
</script> 

如何使用 Angular2 和 TypeScript 做类似的事情?

提前致谢!

最佳答案

您可以使用 npm 模块:

angular2-chartjs

然后你可以在你的模块中像这样使用它:

import { ChartModule } from 'angular2-chartjs';

@NgModule({
  imports: [ ChartModule ]
  // ...
})
export class AppModule {
}

在 html 模板中:

<chart [type]="type" [data]="data" [options]="options"></chart>

不要忘记用数据填充它;)

关于node.js - Chartjs 在 Angular2 应用程序中的使用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36869875/

相关文章:

typescript - 如何访问嵌套对象类型的公共(public)属性,这些对象本身是使用泛型类型参数访问的

Angular 2 : Best Practice for Data Layer

angular - 使用 ViewChild 访问 MatDrawer 在 Angular 8 中抛出错误

javascript - 仅允许来 self 的 chrome 扩展程序的请求

jquery - 如何在 typescript 中使用 jQuery 控制轮播?

javascript - 在 Angular 2 + 中从父组件调用子组件方法

mysql - 如何从 Angular -> NodeJs/ExpressJs -> MySQL 发送 POST 方法

javascript - 存储前端记录的用户数据

xml - 在 Node 中为 xml 模板化 ejs

javascript - Node.js 无法编译已安装的测试之一