Ionic / Angular ion-select не принимает начальное значение при использовании в реактивной форме - PullRequest
0 голосов
/ 08 ноября 2019

У меня есть 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, а затем установить значение формы ..

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...