Angular Google 图表 - 安装和环境设置

本教程将指导您如何准备开发环境以开始使用 Google 图表和 Angular 框架。 在本章中,我们将讨论 Angular 6 所需的环境设置。要安装 Angular 6,我们需要以下内容 −

  • Nodejs
  • Npm
  • Angular CLI
  • 用于编写代码的 IDE

Nodejs 必须大于 8.11,npm 必须大于 5.6。

Nodejs

要检查您的系统上是否安装了nodejs,请在终端中输入node -v。 这将帮助您查看系统上当前安装的 Nodejs 版本。

C:\>node -v
v8.11.3

如果它没有打印任何内容,请在您的系统上安装nodejs。 要安装nodejs,请进入nodejs主页 https://nodejs.org/en/download/ 并根据您的操作系统安装软件包。

根据您的操作系统,安装所需的软件包。 一旦安装了nodejs,npm也会随之安装。 要检查 npm 是否已安装,请在终端中输入 npm -v。 它应该显示 npm 的版本。

C:\>npm -v
5.6.0

在 Angular CLI 的帮助下,Angular 6 安装非常简单。 访问 Angular 主页 https://cli.angular.io/ 获取命令参考。

Angular CLI

输入npm install -g @angular/cli,在您的系统上安装 Angular cli。

安装 Angular CLI

安装 Angular CLI 后,您将在终端中获得上述安装。 您可以使用您选择的任何 IDE,即 WebStorm、Atom、Visual Studio Code 等。


安装 Google 图表包装器

运行以下命令在创建的项目中安装 Google 图表包装器模块。

googleChartsApp> npm angular-google-charts

+ angular-google-charts@0.1.0
added 2 packages in 20.526s

在 app.module.ts 文件中添加以下条目

import { GoogleChartsModule } from 'angular-google-charts';

imports: [
   ...
   GoogleChartsModule
],