Angular: добавьте «бесплатную опцию ввода» в

Question

У меня есть этот код:

'<mat-form-field>
      <mat-select #Version >
        <mat-option value="1.36.0">1.36.0</mat-option>
        <mat-option value="1.42.0">1.42.0</mat-option>
        <mat-option value="1.43.5">1.43.5</mat-option>
        <mat-option value="1.44.2">1.44.2</mat-option>
      </mat-select>
</mat-form-field>'

Проблема в том, что пользователь может время от времени добавлять новую версию.Поэтому я хотел бы добавить опцию, где пользователь может заполнить своей клавиатурой новую версию, которая еще не указана в этом поле.Ребята, вы знаете, как этого добиться?

https://stackblitz.com/edit/angular-xxselg

https://angular -xxselg.stackblitz.io

Answer 1

Прежде всего, вам нужно создать новый массив строк.и используйте * ngFor.

Вы можете использовать mat-input , чтобы получить новую версию. И, mat-button , чтобы обновить массив.

Взгляните на этот пример Stackblitz , который показывает, как это реализовать.

Кстати, в вашем примере Stackblitz отсутствует угловая стилизация материала.Добавлено: "~@angular/material/prebuilt-themes/indigo-pink.css"; в файле styles.css.

Подробнее о стайлинге угловых материалов Здесь .