Образец каскадного углового материала (с реактивными формами)

Question

Какая-нибудь хорошая демонстрация / пример, показывающий, как каскадировать несколько угловых матовых элементов управления автозаполнением? Все ссылки, которые я видел, показывают только одно автономное автозаполнение. Мне нужно связать два элемента управления (возможно, три), используя реактивные формы.

Хороший подобный образец может быть похож на автозаполнение для стран, штатов / провинций, а затем городов (в зависимости от выбора, который может контролировать дочерний элемент, в зависимости от наличия информации).

Данные предварительно загружены в память (не огромные), поэтому нет необходимости искать сервер асинхронно.

Answer 1

Каждый mat-autocomplete применяется на обычных FormControl; либо независимыйFormControl или то, что включено в FormGroup.

Например; допустим, что у нас есть Страна и Города; каждый из нихmat-autocomplete, но вы не можете выбрать город, пока не выберете страну; право?

Надеюсь, вы это имели в виду.

Так; чтобы справиться с этим:

• Сделайте Country formControl обычным mat-autocomplete без дополнительных настроек.

• Сделайте City formControl отключенным, пока пользователь не выберет страну.

• добавлять optionSelected за countryAutocomplete для включения и фильтрации городов.

Я привел простой пример, чтобы объяснить этот пример.

https://stackblitz.com/edit/multiple-autocomplete

если у вас 3 или 4; сделайте их похожими на город.