Невозможно добавить выбранный атрибут к ion-option

Я не могу найти проблему в том, как я не могу добавить выбранный атрибут, чтобы получить выбранное свойство по умолчанию в ion-option

<ion-list>
      <ion-item>
          <ion-label>example</ion-label>
            <ion-select 
            [selectOptions] = "selectOptionsEducation" 
            [(ngModel)] = "filterData.education"
            multiple = "true" placeholder = "Class 10">
                <ion-option value = "class 11" selected = "true">Class 11</ion-option>
                <ion-option [selected] = "true" value = "class 12">Class 12</ion-option>
                <ion-option value = "graduation">Graduation</ion-option>
            </ion-select>
        </ion-item>
  </ion-list>
Стоит ли изучать PHP в 2023-2024 годах?
Стоит ли изучать PHP в 2023-2024 годах?
Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Приемы CSS-макетирования - floats и Flexbox
Приемы CSS-макетирования - floats и Flexbox
Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Пользовательский скаляр GraphQL
Пользовательский скаляр GraphQL
Листовые узлы системы типов GraphQL называются скалярами. Достигнув скалярного типа, невозможно спуститься дальше по иерархии типов. Скалярный тип...
1
0
409
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Я не уверен, что вы хотите на самом деле. Но,

1. Если вы пытаетесь выбрать по умолчанию вариант номер 2, удалите квадратные скобки [] и просто установите

<ion-option selected = "true" value = "class 12">Class 12</ion-option>

как указано в варианте №1.

Или просто установите

<ion-option selected value = "class 12">Class 12</ion-option>
  1. Если вы хотите динамически изменять свой выбор ion-option, создайте глобальную переменную в вашем файле .ts, а затем вы можете использовать эту переменную в компоненте для динамического выбора, например:
<ion-option [selected] = "class12Selected" value = "class 12">Class 12</ion-option>

Этот метод точно не будет работать для нескольких вариантов выбора.

Rahul Raj 21.05.2019 06:36
Ответ принят как подходящий

Вам не нужно добавлять выбранный атрибут в ion-option, чтобы выбрать опцию

Чтобы получить автоматический выбор ion-option, вам нужно передать значение ion-option в переменную [(ngModel)].

//page.ts

filterData = {
  education = ['graduation']
}


//page.html

<ion-list>
      <ion-item>
          <ion-label>example</ion-label>
            <ion-select 

            [(ngModel)] = "filterData.education"
            multiple = "true" placeholder = "Class 10">
                <ion-option value = "class 11" >Class 11</ion-option>
                <ion-option value = "class 12">Class 12</ion-option>
                <ion-option value = "graduation">Graduation</ion-option>
            </ion-select>
        </ion-item>
  </ion-list>

Другие вопросы по теме