Выбор материала Angular 6+ с указанным значением
Я пытаюсь использовать mat-select с поиском на базе бэкэнда, но при перезагрузке данных возникает проблема. Я использую объект вроде {value: 1, name: 'aloha'} для хранения и отображения значения. И я хочу передать .value как значение в option. В настоящее время я застрял в передаче всего значения и использовании его для создания опции с этими данными, чтобы отображаемое значение было в select. Есть лучший способ сделать это? И второй вопрос: я использую этот выбор в formcontrol. Как установить начальное значение, если в select нет параметров, но мне нужно, чтобы выбранный вариант был изначально предоставлен. Как и у меня на бэкэнде [кошка, собака, слон] и миллионе других значений, но мне, например, нужно предварительно выбрать кошку. Как новый FormControl (cat). Я мог бы жить с передачей FormControl ({value: 5, display: cat}), но есть ли способ получить control.value только value от этого объекта? Я не хочу, чтобы он возвращал весь объект ({имя, значение})
Ответы 1
Первый вопрос.
<mat-select placeholder = "Placeholder" formControlName = "yourForm">
<mat-option *ngFor = "let x of yourArray" [value] = "x.value">
{{ x.name }}
</mat-option>
</mat-select>
Вы можете использовать [value] для сохранения его значения и использовать интерполяцию для отображения желаемого значения (например, {{x.name}}).
Второй вопрос.
Вышеупомянутая установка касается №2. Теперь вы можете использовать FormControl({value: 5, display: cat})
Убедитесь, что в вашем ts-файле есть selectControl= new FormControl();
Если это не решит вашу проблему, покажите мне, что написано на вашей консоли.
<mat-select [disableOptionCentering] = 'true' [placeholder] = "placeholder" [formControl] = "selectControl"> с this.selectControl.setValue ({имя: 'test', значение: 'test'}); не работает :(