2

I have a component in angular 2 where i generate a list of checkboxes from an array.

Now i need to populate a different array basd on the checkboxes checked and this should be a two way binding, meaning the checkboxes must already be checked if their values are already in the array. I used a plugin called checklist-model in angular 1 to do this.

<h4><label><input type="checkbox" value="" (click)=checkAll(screen)>{{screen.screen_name}}</label></h4>
            </div>
            <div class="row">
                <div class="col-lg-3 col-md-4 col-sm-6" *ngFor="let perm of screen.permissions">                    
                    <div class="checkbox" >
                      <label><input type="checkbox" (change)="logCheckbox(cb)" [(ngModel)]="permissionsArray[]" [value]="perm.permission">{{perm.permission}}</label>
                    </div>
                </div>
            </div>

In the above code the permissionsArray[] in ngModel is just for representation to show you what I want. I want to populate the permissionsArray[] based on the permissions selected and vice versa.

I tried creating a local reference variable on the checkboxes but that didn't work too since the whole array is dynamic.

Another requirement would be if the Screen checbox is checked then all child checkboxes in the screen should also be checked and I have no clue on how to approach that either.

I guess the basic issue is I am not sure how to access the checkboxes individually from my code behind since they are dynamic.

Any tips on what approach i should use?

3
  • What forms module are you using? Commented Dec 5, 2016 at 17:49
  • I'm not sure what that means. I thought there was just only one FormsModule from '@angular/forms'; Commented Dec 5, 2016 at 18:32
  • FormsModule or ReactiveFormsModule, they are different approaches to forms. Also, this appears very similar to stackoverflow.com/questions/40950285/… though there are some differences with your master checkboxes to drive changing the children Commented Dec 5, 2016 at 18:41

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.