angular学习笔记

1，快捷键声明一个组件：ng g component components/test，在app目录下建立components文件/test文件和模板（ng g c 文件目录）

2，ng项目快速启动： ng s

3，关键字
    instanceof 左边是否是右边的实例 返回一个Boolean值
    
4，ng-zorro安装，不得不突出ng-zorro是真滴方便，帮我把http模块都安装好了。。
$ ng new PROJECT_NAME
$ cd PROJECT_NAME
$ ng add ng-zorro-antd

5，安装ng的路由
ng generate module app-routing --flat --module=app

6，在ng中引入scss
npm install node-sass --save-dev
npm install sass-loader --save-dev

7，文档（自己写的，待修改）

1，ng引入scss

npm install node-sass --save-dev
npm install sass-loader --save-dev
在angular.json中配置。在projects=》schematics=》@schematics/angular:component加入"style": "sass"，在projects=》architect=》build=》options=》style中改src/style.css为src/style.scss
2，ng引入echart

npm install echarts --save
npm install ngx-echarts@3.2.0 --save
在angular.json文件中build》options》scripts中引入： "node_modules/echarts/dist/echarts.min.js"
在app.module.ts中引入NgxEchartsModule 就可以用了
3，ng引入官方组件meterial

npm install --save @angular/material @angular/cdk @angular/animations
在app.module.ts中引入动画模块BrowserAnimationsModule。
在index.html中引入图标<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
按需在app.module.ts中引入相关组件，如MatInputModule、MatTableModule等
4，ng安装路由

ng generate module app-routing --flat --module=app
配置路由模块，引入RouterModule,Routes。导出RouterModule。
5，组件关系

所有组件均在component文件夹下。
一个组件包括component.html文件：标签骨架，component.scss文件：样式文件，component.ts文件：使用ts写页面逻辑。
appmodule：根组件
indexmodule：放置共用的头部、尾部、侧边栏。
data-chart文件夹：里面声明的组件为index的子组件，放置各个数据罗盘页面。
first-phase文件夹：放置一期修改后的单页面，与index属于同级。
6，快捷命令

ng new project 创建名为project的angular项目
ng s启动服务
ng g c 文件名 快速创建组件

8，使用热更新hmr

npm install @angularclass/hmr --save-dev    安装，修改对应文件
ng s --hmr  启动

9，给项目生成文件树

npm install -g tree-node-cli    // 安装树结构
treee -L 3 -I "node_modules" -a --dirs-first    // 在终端中生成一个树目录