angularangular-materialangular2-formbuilder

formBuilder.array + Angular material check box: how can I dynamically bind


I want to create a dynamic set of check boxes using Angular Material, the documentation example, but that grows dynamically.

enter image description here

It should bind like on the normal checkbox, click on the link I have added to the documentation. it is not dynamically binding to the check boxes, as it does manually.

See my stackblitz sandbox here. (forgot the save, tired; feel free to focus on the problem! I may rebuild later!)

The problem seemed trivial, but I am stuck. I have been doing research, testing samples, but none of them actually solve the problem. What called my attention are so many codes that claim to solve, but when you try, they do not! 🤣😂😁 The issue is using formbuilder dynamically, using arrays.

I am able to advance in several directions, but, what I want. Of course, I have enter the tags manually, as in the documentation; but I want to reuse the code, and dynamically adapt as new options are added, without needing to change locally all the code.

I am building an app on Non violent communication, for my next ebook! 🤗🤗🤗

===

Note I have decided to no longer use this option, feel free to solve the problem anyway, I will be glad to participate, and write a Medium article, and make the contributions! 🤗🤗🤗 See my Medium profile See the app here

I am always glad to solve problems, it is my high!


Solution

  • Here is the code where I didn't used FormArray, but the code for constructing the checkboxes could be used with dynamic options.