级联 Angular Material 设计示例(具有反应形式)
Cascaded Angular Material Design sample (with reactive forms)
任何好的 demo/sample 展示如何级联多个 angular mat-autocomplete 控件?我看到的所有参考资料都只显示了一个独立的自动完成功能。我需要 link 两个控件(可能是三个)使用反应形式。
一个很好的类似样本可以像国家/地区的自动完成,states/provinces然后是城市(根据选择,子控件可能会或不会出现,具体取决于是否有信息)。
数据已预加载到内存中(不是很大),因此无需异步查找服务器。
每个mat-autocomplete
应用于普通FormControl
;独立 FormControl
或包含在 FormGroup
.
中
例如;假设我们有 Country 和 Cities;他们每个人都是 mat-autocomplete
,但你不能 select city 直到你 select country;对吗?
我希望这就是你的意思。
所以;处理这个:
将 Country formControl 设为普通的 mat-autocomplete,无需额外配置。
在用户 select 国家/地区之前禁用城市 formControl。
为 countryAutocomplete
添加 optionSelected
以启用和过滤城市。
我做了一个简单的例子来解释这个例子
https://stackblitz.com/edit/multiple-autocomplete
如果你有 3 个或 4 个;让他们喜欢城市。
任何好的 demo/sample 展示如何级联多个 angular mat-autocomplete 控件?我看到的所有参考资料都只显示了一个独立的自动完成功能。我需要 link 两个控件(可能是三个)使用反应形式。
一个很好的类似样本可以像国家/地区的自动完成,states/provinces然后是城市(根据选择,子控件可能会或不会出现,具体取决于是否有信息)。
数据已预加载到内存中(不是很大),因此无需异步查找服务器。
每个mat-autocomplete
应用于普通FormControl
;独立 FormControl
或包含在 FormGroup
.
例如;假设我们有 Country 和 Cities;他们每个人都是 mat-autocomplete
,但你不能 select city 直到你 select country;对吗?
我希望这就是你的意思。
所以;处理这个:
将 Country formControl 设为普通的 mat-autocomplete,无需额外配置。
在用户 select 国家/地区之前禁用城市 formControl。
为
countryAutocomplete
添加optionSelected
以启用和过滤城市。
我做了一个简单的例子来解释这个例子
https://stackblitz.com/edit/multiple-autocomplete
如果你有 3 个或 4 个;让他们喜欢城市。