Переключить сегмент, используя значение из formControl - PullRequest
Новая
       26

Переключить сегмент, используя значение из formControl

0 голосов
/ 15 апреля 2020

У меня есть страница редактирования, где я получаю значения из базы данных. Я пытаюсь присвоить значение ion-сегмента автоматически.

Это мой html с formControl и метод, который извлекает данные из БД: 

     this.form = new FormGroup({
                  title: new FormControl(this.task.title,{
                    updateOn: 'blur',
                    validators: [Validators.required]
                  }),
                  description: new FormControl(this.task.description, {
                    updateOn: 'blur',
                    validators: [Validators.required, Validators.maxLength(180)]
                  }),
                  completed: new FormControl(this.task.completed, {
                    validators: [Validators.required]
                  })
                });
      <ion-list-header>Completed</ion-list-header>
            <ion-segment formControlName="completed" value="completed">
              <ion-segment-button  value="true">
                <ion-label>Yes</ion-label>
              </ion-segment-button>
              <ion-segment-button value="false">
                <ion-label>No</ion-label>
              </ion-segment-button>
            </ion-segment>

Мне удалось передать заголовок и описание, но ионный сегмент не назначен. Любой совет, как я могу это сделать?

enter image description here

1 Ответ

1 голос
/ 16 апреля 2020

В вашем случае атрибут value на вашей кнопке ion-сегмента представляет собой строку «true» вместо истинного значения. Чтобы достичь того, что вы ищете, вам нужно что-то вроде этого: 

      <ion-list-header>Completed</ion-list-header>
        <ion-segment [value]="form.value.completed? 'yes' : 'no'">
          <ion-segment-button  value="yes">
            <ion-label>Yes</ion-label>
          </ion-segment-button>
          <ion-segment-button value="no">
            <ion-label>No</ion-label>
          </ion-segment-button>
        </ion-segment>

Извлеките этот пример стекаБлиц .

...