Angular入门，第一个程序

一、是什么

AngularJS 是一个 JavaScript 框架。它可通过 <script> 标签添加到 HTML 页面。

AngularJS 通过 指令 扩展了 HTML，且通过 表达式 绑定数据到 HTML。

二、为什么

1、横跨所有平台：学会用Angular构建应用，然后把这些代码和能力复用在多种多种不同平台的应用上 —— Web、移动 Web、移动应用、原生应用和桌面原生应用。

2、速度与性能：通过Web Worker和服务端渲染，达到在如今(以及未来）的Web平台上所能达到的最高速度。

Angular让你有效掌控可伸缩性。基于RxJS、Immutable.js和其它推送模型，能适应海量数据需求。

3、美妙的工具：使用简单的声明式模板，快速实现各种特性。使用自定义组件和大量现有组件，扩展模板语言。在几乎所有的IDE中获得针对Angular的即时帮助和反馈。所有这一切，都是为了帮助你编写漂亮的应用，而不是绞尽脑汁的让代码“能用”。

4、百万粉丝热捧：从原型到全球部署，Angular都能带给你支撑Google大型应用的那些高延展性基础设施与技术。

三、怎么做

1、前期准备

1）安装node.js

2)安装代码编码工具：IDEA或Visual Studio

3）安装angular、 typescript、Angular CLI,Angular CLI是Angular的命令行界面。它有助于我们轻松地初始化，开发和维护Angular应用程序。

命令行执行：

npm install angular

npm i typescript --save-dev

npm install -g @angular/cli

检查安装成功 ng version

2、创建第一个程序

1）新建文件夹

2）用工具打开(可略)

3）新建项目 ng new  helloWorld --routing --style less --prefix app -install

在新建的目录下执行命令

4）运行

进入helloWorld目录执行npm start启动服务

输入地址检查结果

3、多模块

1）生成新module ： ng g module admin -m app

2）进入新module,生成 :ng g c user -m admin

ng g c role -m admin

3）修改路由

修改模块下的xx-routing.module.ts

import { Ar01Component } from './rep/ar01.component';

{ path: 'rep/ar01',component: Ar01Component },

4）作菜单

参考：

Angular官网：

https://angular.io/guide/quickstart

https://www.angular.cn/

基于Angular的前端UI：https://ng.ant.design/docs/introduce/zh