Angular 18由于 Angular 每半年发布一个主版本迭代较快现目前最新稳定版本为 18第一步使用npm install -g angular/cli18命令下载 Angular CLI 18效果如下第二步使用ng new my-angular-app创建一个全新的项目以此为例我创建的项目名为 myex使用以下命令运行项目查看效果cd my-angular-app ng serve第三步使用ng add ng-zorro-antd18命令导入组件效果如下再使用ng serve命令运行效果如下使用ng-zorro-antd中的组件需要先导入依赖也就是在app.component.ts中添加下述命令import { NzButtonModule } from ng-zorro-antd/button;修改html中的代码使用ng-zorro-antd组件库中的按钮组件CtrlS进行保存却产生报错效果如下原因是项目缺少了ctrl/tinycolor这个第三方库但ng-zorro-antd组件库又依赖于它。所以使用npm install ctrl/tinycolor命令下载依赖包下载完成之后再次运行项目效果如下第四步在 app.component.ts 中导入 NzButtonModule在app.component.ts中导入NzButtonModule并添加到imports数组中代码如下import { Component } from angular/core; import { NzButtonModule } from ng-zorro-antd/button; Component({ selector: app-root, standalone: true, imports: [NzButtonModule], templateUrl: ./app.component.html, styleUrls: [./app.component.css] }) export class AppComponent { title my-angular-app; }第五步在 app.component.html 中添加按钮代码在app.component.html中添加 ng-zorro-antd 的按钮组件代码如下button nz-button nzTypeprimary主要按钮/button button nz-button nzTypedefault默认按钮/button button nz-button nzTypedashed虚线按钮/button button nz-button nzTypetext文本按钮/button button nz-button nzTypelink链接按钮/button保存后运行ng serve命令即可在浏览器中看到不同类型的按钮效果包括主要按钮、默认按钮、虚线按钮、文本按钮和链接按钮。