Angular2入门（一）

原先用vue.js写的项目，最近领导要求改用Angular，于是开始自学之路。网上搜索了众多资料，包括谷歌原版书籍，但是Angular自从17年开始分为AngularJs和Angular两个版本，相差巨大，并且Angular已从2.0更新到6.0，网上资料庞杂且年代久远，不得要领。

花费了大量寻找资料的时间之后，终于摸索到了正确路线，在此记录学习历程。
此处不会详细介绍Angular的细节，只提供快速创建能运行Angular项目的教程。
需要理解细节可以到以下链接下载相关书籍学习：
揭秘Angular2 :  https://download.csdn.net/download/qq_36625806/10472981
迈向Angular2 :  https://download.csdn.net/download/qq_36625806/10472982

1.配置开发环境
操作系统：win7
开发平台：node.js v8版本以上
Angular版本：6.0

node.js下载地址：https://nodejs.org/en/

 

安装完node之后，打开windows命令窗口，输入下面的命令确认安装成功：
-->> node -v 

 

安装Angular命令行工具：Angular CLI ：
-->> npm install -g @angular/cli

 

在命令行输入 ng -v 确认Angular CLI 安装成功。安装成功会有一个Logo展示。

 

2.创建Angular项目：
-->> ng new student  (student 是项目名称)

3.如何启动Angular的项目？
进入student项目，在命令行输入以下命令：
-->> npm start

当命令执行完毕，打开浏览器，输入:
localhost:4200 即可！（如果你没有手工修改端口的话）

 

3.如何在已有的项目引入其它插件？
进入student项目，在命令行输入以下命令：

-->> npm install bootstrap --save

找到项目的根目录找到angular.json，如下图填写：

 

4.如何自动创建自己的组件？
这个问题需要你试一下手工创建组件的痛苦，然后你就知道自动创建组件有多爽了！
以下直接说自动创建组件的用法：
自动创建页面的导航栏：