视图的封装模式

默认情况下组件 @Component 是这样的：

@Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css']})

如果，使用了 -s 、 -t 后，是这样子的：

@Component({ selector: 'app-root', template: ` <h1>Tour of Heroes</h1> <app-hero-main [hero]="hero"></app-hero-main> `, styles: ['h1 { font-weight: normal; }']})

如果，使用了 -p zx 后，是这样子的：

@Component({ selector: 'zx-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css']})

ng generate

代码生成神器，能会是开发过程中，使用最频繁的一个命令

ng generate component <name> [options]：生成一个组件

ng generate module <name> [options]：生成一个模块

ng generate directive <name> [options]：生成一个指令

ng generate class <name> [options]：生成一个类

ng generate guard <name> [options]：生成一个守卫

ng generate interface <name> [options]：生成一个接口

ng generate enum <name> [options]：生成一个枚举

ng generate pipe <name> [options]：生成一个管道

ng generate service <name> [options]：生成一个服务

ng g c <name> [options]：生成一个组件

ng g m <name> [options]：生成一个模块

ng g d <name> [options]：生成一个指令

ng g cl <name> [options]：生成一个类

ng g g <name> [options]：生成一个守卫

ng g i <name> [options]：生成一个接口

ng g e <name> [options]：生成一个枚举

ng g p <name> [options]：生成一个管道

ng g s <name> [options]：生成一个服务

option其他大同小异，接下来就来罗列一下，备查

component-选项

--dry-run (alias: -d )：不生成实际文件

--force (alias: -f )：强制覆盖文件

--project：项目名称

--inline-style (alias: -s )：使用行内有样式

--inline-template (alias: -t )：使用行内模板

--view-encapsulation (alias: -v )：视图的封装模式， ViewEncapsulation

--change-detection (alias: -c )：指定变化检查策略， ChangeDetectionStrategy

--prefix (alias: -p )：指定组件指令选择器前缀

--styleext：指定组件样式文件名后缀，暂不清楚意义何在

--spec：是否生成单元测试文件，默认 true ,可选 false

--flat：不生成独立目录，直接生成在 src/app 下

--skip-import：不会自动import到模块

--selector：指定指令选择器

--module (alias: -m )：在哪个module中声明(import)

--export：组件导入的模块，是否export组件

module-选项

--dry-run (alias: -d )：不生成实际文件

--force (alias: -f )：强制覆盖文件

--project：项目名称

--routing：生成的时候包含routing

--routing-scope：routing的组用于

--spec：是否生成单元测试文件，默认 true ,可选 false

--flat：不生成独立目录，直接生成在 src/app 下

--module (alias: -m )：在哪个module中声明(import)

directive-选项

--dry-run (alias: -d )：不生成实际文件

--force (alias: -f )：强制覆盖文件

--project：项目名称

--prefix (alias: -p )：指定指令选择器前缀

--spec：是否生成单元测试文件，默认 true ,可选 false

--skip-import：不会自动import到模块

--selector：指定指令选择器

--flat：不生成独立目录，直接生成在 src/app 下

--module (alias: -m )：在哪个module中声明(import)

--export：组件导入的模块，是否export组件

class-选项

--dry-run (alias: -d )：不生成实际文件

--force (alias: -f )：强制覆盖文件

--project：项目名称

--spec：是否生成单元测试文件，默认 true ,可选 false

--type：指定class文件类型，name. type .ts

guard-选项

--dry-run (alias: -d )：不生成实际文件

--force (alias: -f )：强制覆盖文件

--spec：是否生成单元测试文件，默认 true ,可选 false

--flat：不生成独立目录，直接生成在 src/app 下

--module (alias: -m )：在哪个module中声明(import)

--project：项目名称

interface-选项

--dry-run (alias: -d )：不生成实际文件

--force (alias: -f )：强制覆盖文件

--project：项目名称

--prefix：前缀，文件 name.ts ,直接接口名称是 prefixName

enum-选项

--dry-run (alias: -d )：不生成实际文件

--force (alias: -f )：强制覆盖文件

--project：项目名称

pipe-选项

--dry-run (alias: -d )：不生成实际文件

--force (alias: -f )：强制覆盖文件

--project：项目名称

--flat：不生成独立目录，直接生成在 src/app 下

--spec：是否生成单元测试文件，默认 true ,可选 false

--skip-import：不会自动import到模块

--module (alias: -m )：在哪个module中声明(import)

--export：组件导入的模块，是否export组件

service-选项

--dry-run (alias: -d )：不生成实际文件

--force (alias: -f )：强制覆盖文件

--project：项目名称

--flat：不生成独立目录，直接生成在 src/app 下

--spec：是否生成单元测试文件，默认 true ,可选 false

ng serve

作用：构建应用，并本地web开发服务器

ng serve [options]

常用的options:

--open (alias: -o )：直接在浏览器中打开

--aot：使用 AOT编译

--prod ：按照生产环境配置启动

其他参见 ng serve --help

ng build

ng lint

ng test

ng e2e

ng get/ng set

ng doc

ng xi18n

ng update