Angular formgroup not updated with checkbox value

Question

I'm having a hard time figuring out something that is very likely a mistake on my part.

I'm creating a custom dynamic form component that will allow developers to create forms using only TS. The problem is happening with checkboxes. After If I read FormGroup's value before clicking the checkbox it's undefined, if I click on it, it becomes (correctly) true, but if I click again, it remains (uncorrectly) true. What am I missing here?

I've created a stackblitz to show this behavior. Please look at the console for output.

https://stackblitz.com/edit/angular-fydiwl

Thanks!

follow the steps in this article. this is the correct way to build custom form items. alligator.io/angular/custom-form-control. in short you implement ControlValueAccessor and then can that component as you would a native input element. — delashum
– delashum, Commented Jun 28, 2019 at 18:02
@delashum thanks, I was able to fix the code using yurzui's answer. But I'll definitely take a look at the article later. — eestein
– eestein, Commented Jun 28, 2019 at 18:30

yurzui · Accepted Answer · 2019-06-28 18:02:15Z

5

The problem here is that Angular can't recognize the appropriate ControlValueAccessor for your control since your're using dynamic type:

<input ... type="{{inputType}}"

while accessor for checkbox looks for specific type

@Directive({
  selector: 'input[type=checkbox]...

This means that you have to specify <input type="checkbox" explicitly in order it to be working.

Forked Stackblitz

answered Jun 28, 2019 at 18:02

yurzui

215k32 gold badges450 silver badges413 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

eestein Over a year ago

Thanks, that was it. Guess I should've checked the source code first :D. thanks for your help :)

yurzui Over a year ago

I think that it's not such transparently so it is not your fault

Collectives™ on Stack Overflow

Angular formgroup not updated with checkbox value

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related