samedi 26 août 2017

group of checkboxes with that work correctly

I searched a lot but couldn't find a correct answer that I'm looking for. I want to have a group of checkboxes in a form that if they are checked, they work correct and show it in a div tag.

export class MyComponent {
options = [
{name:'OptionA', value:'1', checked:true},
{name:'OptionB', value:'2', checked:false},
{name:'OptionC', value:'3', checked:true}
]
get selectedOptions() { // right now: ['1','3']
return this.options
          .filter(opt => opt.checked)
          .map(opt => opt.value)
  }
}

and html:

<div class="form-group">
<label for="options">Options:</label>
<div *ngFor="let option of options">
    <label>
        <input type="checkbox"
               name="options"
               value=""
               [(ngModel)]="option.checked"/>
        
    </label>
</div>

but I'm sure it's not correct because the checked property is given by myself and if user changes it doesn't work. Could you please help me to write a simple code for checkbox? Thank you very much.




Aucun commentaire:

Enregistrer un commentaire