Angular Google Charts - 环境搭建



本教程将指导您如何准备开发环境,以便开始使用 Google Charts 和 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://node.org.cn/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。

Install Angular CLI

安装 Angular CLI 后,您将在终端中看到上述安装信息。您可以使用任何您选择的 IDE,例如 WebStorm、Atom、Visual Studio Code 等。

安装 Google Charts 包装器

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

googleChartsApp> npm angular-google-charts

+ [email protected]
added 2 packages in 20.526s

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

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

imports: [
   ...
   GoogleChartsModule
],
广告