angular + material 从0开始小项目开发（以项目入手学习）（一）

自学angular有一段时间了，由于本人重度懒癌，导致学习进度严重缓慢，因此决定开始以记录的方式进行…从这篇博客开始记录学习的过程，更新多少期就要看缘分了…
闲话少叙，现在开始第一篇：

搭建项目

开发系统：macos + webstorm

1，使用angular-cli来搭建
如果没有装过angular-cli，需要先安装angular-cli，如果不确定自己是否装过，可以在控制台输入下ng 看下是否有这个命令，如果没有会显示 command not found 之类的，那么使用npm 安装
命令为：
npm install -g @angular/cli

如果已存在则为：

此时证明存在。
使用ng new 创建项目

上述命令为创建 test的angular项目，并且添加路由，以及使用scss为css文件。

此时创建完成。
创建完成后的文件夹

使用命令
ng serve项目开始编译，获得项目地址：

点开控制台的链接：

自此，一个angular项目算是构建完成了。

路由初体验

众所周知，学习一门新的技术或者手段，应该从hello world 开始，但是我们现在看到的页面并不是，所以要把app.component.html中的所有东西删掉,只保留以下代码

然后我们就获得了朴实无华hello world
tips:不要删除以下代码，这个是路由切换路径

那么如何使用路由呢，我们new一个component试试吧。

在 app目录下创建了一个business的文件夹，cd到business文件夹，使用ng来创建组件。内容包括 scss样式文件，html文件，ts文件和spec.ts测试文件。

ng g component login

今天要下班了，只写这么多嘻嘻嘻，明天写第二部分～