Angular Google Charts - Umgebung einrichten

In diesem Tutorial erfahren Sie, wie Sie eine Entwicklungsumgebung vorbereiten, um Ihre Arbeit mit Google Charts und Angular Framework zu beginnen. In diesem Kapitel werden wir das für Angular 6 erforderliche Umgebungs-Setup erläutern. Um Angular 6 zu installieren, benötigen wir Folgendes:

Nodejs
Npm
Angular CLI
IDE zum Schreiben Ihres Codes

Nodejs muss größer als 8,11 und npm größer als 5,6 sein.

Nodejs

Geben Sie ein, um zu überprüfen, ob nodejs auf Ihrem System installiert ist node -vim Terminal. Auf diese Weise können Sie die aktuell auf Ihrem System installierte Version von nodejs anzeigen.

C:\>node -v
v8.11.3

Wenn nichts gedruckt wird, installieren Sie nodejs auf Ihrem System. Um nodejs zu installieren, gehen Sie zur Homepagehttps://nodejs.org/en/download/ von nodejs und installieren Sie das Paket basierend auf Ihrem Betriebssystem.

Installieren Sie basierend auf Ihrem Betriebssystem das erforderliche Paket. Sobald nodejs installiert ist, wird auch npm installiert. Um zu überprüfen, ob npm installiert ist oder nicht, geben Sie npm -v in das Terminal ein. Es sollte die Version des npm anzeigen.

C:\>npm -v
5.6.0

Angular 6-Installationen sind mit Hilfe von Angular CLI sehr einfach. Besuchen Sie die Homepagehttps://cli.angular.io/ von eckig, um die Referenz des Befehls zu erhalten.

Art npm install -g @angular/cli, um eckige cli auf Ihrem System zu installieren.

Sie erhalten die obige Installation in Ihrem Terminal, sobald Angular CLI installiert ist. Sie können eine beliebige IDE Ihrer Wahl verwenden, z. B. WebStorm, Atom, Visual Studio-Code usw.

Installieren Sie Google Charts Wrapper

Führen Sie den folgenden Befehl aus, um das Google Charts Wrapper-Modul in dem erstellten Projekt zu installieren.

googleChartsApp> npm angular-google-charts

+ [email protected]
added 2 packages in 20.526s

Fügen Sie den folgenden Eintrag in die Datei app.module.ts ein

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

imports: [
   ...
   GoogleChartsModule
],