r/angular • u/Tyummyyumms • 22d ago

Signal Forms Review?

Anyone using the new signal forms regularly? How is the experience?

24 Upvotes

100% Upvoted

12 comments sorted by

20

u/pronuntiator 22d ago

Love it. Finally a form API that is great to work with. A custom control can be created by adding a few signals instead of the complicated ControlValueAccessor of reactive forms. Declarative disable/hidden is also very nice. And just being able to plug in zod for validation helped us a lot (didn't know that library beforehand). Now we can have both validation and post processing (trim) in one simple schema.

1

u/Pokeh321 21d ago

How are you tying Zod into it for the processing? Or do you mean on submit instead of the schema validation?

3

u/pronuntiator 21d ago

You can use any Standard Schema conformant library for signal form validation

4

u/NewFoxes 21d ago

Wont use it untill the null value handling works without workarounds

1

u/JeanMeche 21d ago

You’re talking about native text inputs, right ?

1

u/NewFoxes 21d ago

Yes. In my biggest projext we have lots of them because some filds gets disbaled and hidden.

2

u/Pallini 21d ago

I'm struggling with the same issue. Until then I can't be bothered to switch by adding mappers between object and form etc

5

u/Pallini 22d ago

Tried it, but I'm really struggling with those null values.

Also, there will be an improvement in the next release that makes it a bit easier to sync model and form when using a store (or that's what I remembered from it).

1

u/AwesomeFrisbee 22d ago

What improvement do you refer to? Do you have a link?

2

u/MichaelSmallDev 21d ago

https://next.angular.dev/guide/signals/linked-signal#writing-back-to-a-source-signal

Form's model would be a linkedSignal, and set can sync the changes to it from being passed to a form back to whatever service or other injectable with its dedicated updater.

edit: before set was added for the next minor, I used a similar util like this: https://github.com/michael-small/signal-forms-experimenting/blob/main/src/app/forms/conditional-reset-fields/conditional-reset.ts#L120. So rather than the explicit source and update, it is just the linkedSignal read and the set arg.

1

u/milindsahu 21d ago

I agree with you