Получить значения из группы флажков Angular Material?
Я пытаюсь понять, как получить выбранные значения группы флажков Angular (7) Material.
Допустим, у меня есть область в форме «ароматы» и 3 флажка со значениями «шоколад», «ваниль» и «клубника».
<h3>Flavors</h3>
<mat-checkbox value = "chocolate">Chocolate</mat-checkbox>
<mat-checkbox value = "vanilla">Vanilla</mat-checkbox>
<mat-checkbox value = "strawberry">Strawberry</mat-checkbox>
Поскольку флажки включены и выключены, я хочу обновить переменную (модель) «flavorsAvailable».
Это просто сделать с помощью mat-radio-groups, так как это просто ngModel для элемента группы. Но как мне управлять флажками?
Примечание. Я не хочу использовать список выбора материалов Angular; это только для форм.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Посмотрите, поможет ли это вам:
flavorsAvailable: any[] = [
{ 'id': '0', 'name': 'chocolate' },
{ 'id': '1', 'name': 'vanilla' }
];
getCheckeds(ev): any[] {
return this.flavorsAvailable.filter(x => x.state = ev.target.checked);
}
Если это тот тип списка, который вы упомянули в "Я не хочу использовать список выбора материалов Angular; это только для форм.". Их, это не имеет смысла, вам нужно будет выбрать один за другим в 3 разных ngModels...
@Steve, список выбора материалов, который вы можете использовать [(ngModel)]="variable" [formControl]="control" или в форме formGroupName="property". В любом случае вы получите массив с выбранными параметрами. Я не представляю лучшего способа управлять флажком.
Ну, вы можете использовать только проверку матов, это только использование [(ngModel)]. например если у вас есть массив логических значений. Да, не имеет смысла [значение] в мат-флажке, допустимы только значения: true или false
variable:boolean[]=[]
Вы можете использовать
<mat-checkbox [(ngModel)] = "variable[0]" value = "chocolate">Chocolate</mat-checkbox>
<mat-checkbox [(ngModel)] = "variable[1]" value = "vanilla">Vanilla</mat-checkbox>
<mat-checkbox [(ngModel)] = "variable[2]" value = "strawberry">Strawberry</mat-checkbox>
{{variable|json}}
Логично, хотя и немного странно. Также я использовал variable = []. Спасибо.
Какой тип
flavorsAvailable? Что должно происходить с моделью, когда вы устанавливаете и снимаете флажки?