<nz-cascader
style="width: 300px;"
[nzOptions]="nzOptions"
[(ngModel)]="values"
(ngModelChange)="onChanges($event)"
>
</nz-cascader>
nzOptions:value,label,children
其中:显示的是label,值为vlaue,有子结构的为children
eg:值为:
[“zhejiang”, “ningbo”]
回填值:
public values: any[] = [‘zhejiang’, ‘hangzhou’, ‘xihu’];
nzAllowClear:是否支持清除.boolean:默认:true;
ts:
public options = [{
value: 'zhejiang',
label: '浙江',
children: [{
value: 'hangzhou',
label: '杭州',
children: [{
value: 'xihu',
label: '西湖',
isLeaf: true
}]
}, {
value: 'ningbo',
label: '宁波',
isLeaf: true
}]
}, {
value: 'jiangsu',
label: '江苏',
children: [{
value: 'nanjing',
label: '南京',
children: [{
value: 'zhonghuamen',
label: '中华门',
isLeaf: true
}]
}]
}];
/** init data */
public nzOptions = this.options;
/** ngModel value */
public values: any[] = ['zhejiang', 'hangzhou', 'xihu'];
/* // or like this:
public values: any[] = [{
value: 'zhejiang',
label: 'Zhejiang'
}, {
value: 'hangzhou',
label: 'Hangzhou'
}, {
value: 'xihu',
label: 'West Lake'
}]; */
public onChanges(values: any): void {
console.log("级联的值:", this.values);
}