У меня есть Reactive form
, которое я добавляю в мое Ionic/Angular v4.11.4
приложение.
В нем есть несколько элементов, включая несколько ion-selects
.
Я использую то же самоешаблон во всех моих выборках, например
<ion-select type="text" formControlName='status'
<ion-select-option *ngFor='let cdp of states' [value]="cdp">
{{cdp.description}}
</ion-select-option>
</ion-select>
Список, к которому он привязан, содержит объекты со свойствами id
и description
.
Для каждого я нахожу значениесписки, к которым они привязаны, а затем используйте patchValue
или setValue
, чтобы установить это начальное значение. Я не передаю его в форме инициализации, так как мне нужно получить списки из вызова http.
Код для установки этого значения выглядит следующим образом ...
// The state is the initial value I want to set
const existing = this.states.find(x => x.id === state.id);
if (existing) {
const statusControl = this.editForm.get('status');
statusControl.setValue(existing);
//this.editForm.patchValue({ status: existing });
return;
}
Длядля двух из них это нормально работает, но у меня есть другой, где, что бы я ни делал, просто не будет отображаться это начальное значение. Даже когда я добавляю кнопку для повторного вызова метода set, выбор просто не изменится, он просто останется пустым.
Как только щелчок по нему, значение внезапно СЛЕДУЕТ показывать внизу и правильный переключательпредварительно выбран.
У меня нет идей, я понятия не имею, что отличает этот конкретный выбор. Другие ВСЕГДА работают, этот никогда не работает. Я знаю, что форма имеет правильное значение, и, как указано, элемент управления обновляется, как только я нажимаю на нее.
Я попытался запустить все это внутри zone.run()
, вручную вызывая ChangeDetectorRef.detectChanges()
, простоне покажет значение до тех пор, пока я не нажму на него.
Я заблудился от того, что еще попробовать.
Мой вопрос: кто-нибудь еще сталкивался с этим и знает какой-нибудь обходной путь? или что еще я могу проверить? Я просто не знаю, почему 2 из них работают, а другой нет, но обновляется, как только я нажимаю на него.
Заранее спасибо за любые указатели.
[ОБНОВЛЕНИЕ1]
Я нашел обходной путь, но пока не нашел ответа, так как не уверен, что это правильный подход ..
Итак, то, что я делал, было от ngOnInit
Я делаю всю свою инициализацию, включая загрузку списков данных через http
(все это, я думаю, хорошо). Но я обнаружил, что если я вызываю код для установки значения for сразу после загрузки списка, к которому привязан выбор, он не обновляется.
Однако, если установить код для установки значения, в setTimeout
он вдруг работает ..
Итак, у меня есть что-то вроде ...
this.states = loadfromHttp();
setTimeout(() => {
const existing = this.states.find(x => x.id === state.id);
if (existing) {
const statusControl = this.editForm.get('status');
statusControl.setValue(existing);
return;
}
}
}, 0);
И значение теперь устанавливается. Так что, похоже, нам нужно дать ему время установить this.states
, а затем установить значение формы ..