如果您像我一样，当您开始在角度(特别是当它第一次到达时)工作时，您很快就会被必须设置的大量文件和配置弄得筋疲力尽。创建新组件需要手动创建三个单独的文件，并确保它们正确地放入模块中。一旦你的项目开始增长，这个任务就开始变成一件苦差事。
进来角度Schematics.
ANGLE原理图由ANGLE团队于2018年推出，它提供了一个API来生成和管理ANGLE项目中的文件，以及提供任何所需的依赖项。可以将其视为模板工具。
在本文中，我将向您展示如何利用内置的原理图来简化角度开发。
设置
我们需要做的第一件事是安装ANGLING CLI.
1$ npm install -g @angular/cli@latest
完成后，我们可以通过运行以下命令来创建新项目
1$ ng new my-app
您现在有了一个项目，并希望开始使用组件、服务、指令、守卫等填充它。这些实体中的每一个都可以使用示意图生成。将此原理图的名称作为参数传递给：
1$ ng generate
元器件原理图
为了生成一个名为DashboardComponent的组件，我们使用component示意图：
1$ ng generate component dashboard
2CREATE src/app/dashboard/dashboard.component.scss (0 bytes)
3CREATE src/app/dashboard/dashboard.component.html (24 bytes)
4CREATE src/app/dashboard/dashboard.component.spec.ts (649 bytes)
5CREATE src/app/dashboard/dashboard.component.ts (282 bytes)
6UPDATE src/app/app.module.ts (487 bytes)
您将注意到，CLI创建了四个独立的文件(一个样式表、一个HTML模板、一个测试规范和一个类型脚本文档)，并且还更新了模块。我们可以通过检查app.mode.ts内部来验证它是不是添加的：
1[label app.module.ts]
2import { DashboardComponent } from './dashboard/dashboard.component';
3
4...
5
6@NgModule({
7 declarations: [
8 DashboardComponent
9 ],
10
11...
CLI还将构建组件，使模型具有PascalCase名称，目录为kebob-case。
因此，以下输入：
1$ ng generate dashboard-settings
和
1$ ng generate DashboardSettings
会产生同样的结果。
服务示意图
我们可以使用service示意图创建一个名为SocketService的服务：
1$ ng generate service socket
2CREATE src/app/services/socket.service.spec.ts (333 bytes)
3CREATE src/app/services/socket.service.ts (135 bytes)
默认情况下，这不会为服务生成新目录，而是会在当前路径中生成服务和测试文件。您可以通过设置--Flat False来更改：
1$ ng generate service socket --flat false
2CREATE src/app/services/socket/socket.service.spec.ts (333 bytes)
3CREATE src/app/services/socket/socket.service.ts (135 bytes)
另外请注意，这不会自动将服务添加到NgModule，因此您需要自己添加它。
防护原理图
防护示意图会询问您要实现的接口类型：CanActivate、CanActivateChild或CanLoad。可以使用--implements参数直接传入，也可以交互输入。
要生成一个名为AuthGuard的实现CanActivate的保护，请键入以下内容：
1$ ng generate guard auth --implements CanActivate
2CREATE src/app/auth.guard.spec.ts (346 bytes)
3CREATE src/app/auth.guard.ts (456 bytes)
打开生成的文件，可以看到它实现了CanActivate接口。
管路示意图
管道原理图将在当前目录中生成一个管道，并将其添加到主模块中。您也可以使用--mode参数指定模块。您还可以选择指定应导出管道。
要生成将被导出的名为PhoneTube的管道，请调用以下命令：
1$ ng generate pipe phone --export
2CREATE src/app/phone.pipe.spec.ts (183 bytes)
3CREATE src/app/phone.pipe.ts (203 bytes)
4UPDATE src/app/app.module.ts (696 bytes)
打开app.mode.ts，可以看到模块中已经添加了PhoneTube。
1[label app.module.ts]
2import { PhonePipe } from './phone.pipe';
3...
4
5@NgModule({
6 declarations: [
7 PhonePipe
8 ],
9...
10 exports: [PhonePipe]
11...
指令示意图
指令原理图将生成一个Angular指令。默认情况下，该指令将被添加到模块中。
要生成一个名为SsamingDirective的新指令，请调用：
1$ ng generate pipe sampling
2CREATE src/app/sampling.directive.spec.ts (236 bytes)
3CREATE src/app/sampling.directive.ts (147 bytes)
4UPDATE src/app/app.module.ts (781 bytes)
原理图将使用与角度项目相同的前缀来命名指令。例如，如果您的项目的默认前缀设置为app，则该指令应命名为[appSamping]。您可以通过将--prefix参数传入CLI来手动设置。
继续前进
这些只是ANGLE CLI提供的几个原理图。您可以通过输入以下内容列出所有可用的逻辑示意图
1$ ng generate --help
此外，您还可以通过在ng生成[原理图]后传入--help来获取每个原理图的详细信息
角度示意图是非常棒的工具，可以帮助您简化角度开发。
编码快乐！