docs(signal-forms-tutorial): update new schema syntax in example code. #62702
Conversation
… (chandlerfang@gmail.com)
|
/gemini review |
There was a problem hiding this comment.
Code Review
This PR correctly updates the signal forms schema syntax in the tutorial. I've found one issue in an example where a custom validation error is created as a plain object literal instead of using ValidationError.custom(). Using the factory function is safer and more aligned with the API. I've left a suggestion to fix this.
| required, | ||
| validate, | ||
| } from '@angular/forms/experimental'; | ||
|
|
||
| export const friendSchema: Schema<Friend> = (friend) => { | ||
| export const friendSchema = schema<Friend>((friend) => { | ||
| required(friend.name); | ||
| required(friend.email); | ||
| validate(friend.email, ({value}) => { | ||
| return value().includes('@') ? | ||
| undefined : | ||
| { kind: 'emailFormat' }; |
There was a problem hiding this comment.
The object literal { kind: 'emailFormat' } is not an instance of ValidationError. While this might work due to structural typing in some cases, it's not type-safe and goes against the intended API usage. It's best practice to use ValidationError.custom() to create custom validation errors. This ensures your code is robust and aligned with the framework's validation error handling.
For this specific case, you could also use the built-in ValidationError.email() which produces an error with kind: 'email'.
Using either ValidationError.custom() or ValidationError.email() will require importing ValidationError from @angular/forms/experimental.
| { kind: 'emailFormat' }; | |
| ValidationError.custom({ kind: 'emailFormat' }); |
(chandlerfang@gmail.com)
PR Type
What kind of change does this PR introduce?
What is the current behavior?
old signal form 'Schema' syntax in the example code in signal forms tutorial
What is the new behavior?
update to new signal form 'schema' function syntax in the example code in signal forms tutorial
Does this PR introduce a breaking change?