angular2 группа флажков с обязательным атрибутом

Question

Я хочу создать форму с шаблоном в Angular2 (RC5), которая будет включать в себя группу флажков, ограниченных конкретными атрибутами объекта. Прямо сейчас, у меня есть такая группа, ограниченная в соответствующий массив, как:

<div class="checkbox" *ngFor="let prop of properties"> 
    <label> 
    <input type="checkbox" name="option" id="option [(ngModel)]="prop.state"/> 
    {{prop.name}} 
    </label> 
</div> 

Хотя это довольно просто, я не могу понять, как добавить необходимый атрибут к этой группе флажков. Что я имею в виду, так это то, что мне нужно заставить пользователя выбрать AT LEAST один из групповых флажков, иначе проверка формы не удастся.

Любые идеи?

Answer 1

Я предполагаю, что у вас есть объект или массив со всеми вашими состояниями, если я правильно читать, т.е.

properties = [ 
    { state: false }, 
    { state: false }, 
    { state: false }, 
    // ... etc 
]; 

Вы могли бы понять, если по крайней мере один проверяется путем прослушивания (ngModelChange) на каждом из элементы. Когда он срабатывает, вы можете проверить, чтобы убедиться, что по крайней мере один из состояний проп верна, то в файле шаблона:

<input type="checkbox" name="option" id="option" [(ngModel)]="prop.state" (ngModelChange)="onCheckboxChange()"/> 

И в классе, есть поле, как atLeastOnePropIsTrue, а затем ваш onCheckboxChange функция может выглядеть так:

function onCheckboxChange() { 
    this.atLeastOnePropIsTrue = this.properties.find(a => a.state === true) != null; 
} 

Это не совсем красиво, но это сработает.