主题：Ant Design 中的 Angular Cascader 使用指南
一、Ant Design 简介
Ant Design 是一个面向企业级的设计语言和前端框架，从产品原型到开发结束，都能帮助开发者构建出既美观又易用的 Web 应用程序。它提供了丰富的组件和模块，帮助开发者快速搭建页面和实现各种功能。
二、Angular 框架简介
Angular 是一个开源的应用框架，由 Google 开发和维护，用于构建动态 Web 应用程序。它提供了一套完整的工具集，帮助开发者快速构建出现代化的 Web 应用程序并且易于维护。
三、Ant Design 中的 Cascader 组件
Cascader 是 Ant Design 中的一种级联选择组件，提供了一种多层级的选择方式，用户可以通过级联选择的方式方便地进行多级选项的选择。Cascader 组件适用于省市区选择、分类选择等多级选项需求的场景。
四、Ant Design 中 Cascader 的使用
1. 导入 Cascader 组件
在使用 Ant Design 中的 Cascader 组件前，首先需要在项目中引入该组件。可以通过以下方式导入 Cascader 组件：
```typescript
import {  NzCascaderModule  } from 'ng-zorro-antd/cascader';
```ant design
2. 基本用法
Cascader 组件的基本用法是在模板中添加对应的标签：
```html
<nz-cascader
  [nzData]="options"
  [(ngModel)]="values"
  (ngModelChange)="onChanges($event)">
</nz-cascader>
```
其中 nzData 是需要展示的数据，values 是选择的值，onChanges 方法是选中值改变时的回调函数。
3. 设置选项
Cascader 组件提供了一些选项来控制其显示和行为，如下所示：
- nzOptions：级联选择数据源，格式参考下方 Config 的 nzOptions
- nzSize：输入框大小，可选 large、default 或 small
- nzShowInput：当此项为 true 时，点选每级菜单选项值都会显示在输入框内
- nzChangeOnSelect：是否允许只选中父级菜单项。当此项为 true 时，点击父级菜单选项即可选中；当此项为 false 时，需要点选最后一级菜单选项才可选中
- nzColumnClassName：选择框每一列的类名
- nzLoadData：动态加载选项
- nzLabelProperty：显示的属性名
- nzChangeOn:boolean 如何触发点击后是否立即改变值，点击将设置为 true；只点击最后一级有效
- nzDisabled:boolean 是否禁用   
五、Ant Design 中 Cascader 的高级用法
1. 动态加载数据
Cascader 组件支持动态加载选项的功能，可以根据需要异步加载数据，使用 nzLoadData 属性进行配置。
2. 自定义显示
Cascader 组件还支持自定义显示内容，可以通过 nzDisplayRender 属性来自定义显示的格式和样式。
3. 多选模式
Cascader 组件还支持多选模式，可以通过设置 nzChangeOnSelect 属性来实现多选功能。
六、总结
Ant Design 中的 Cascader 组件是一个非常实用的多级选择组件，能够满足各种多级选项需求的场景。通过本文的介绍，读者可以了解到在 Angular 中如何使用 Ant Design 的 Cascader 组件，并掌握其基本用法和高级用法。希望本文对读者有所帮助。