-
Notifications
You must be signed in to change notification settings - Fork 111
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Sync validation of array? #54
Comments
Do you want to validate the whole array (e.g. contains at least one item) or each element (e.g. each item has a name), or both?
For the former you simply use the validate update function on the array state. For the latter you use the validate update function inside an updateArray update function.
I don't have access to a proper keyboard right now, but I can type up a more thorough example later today.
|
this is 'stripped out' snippet from our app, where we are validating export interface State {
form: FormGroupState<Invoice>;
dateTimeSettings: DateTimeSettings;
}
export interface Invoice extends Entity {
payments: Payment[];
}
export interface Payment extends Entity {
invoiceId: number;
description: string | null;
amount: number;
}
const FORM_NAME = 'INVOICE_DETAIL_FORM';
const initialForm = createForm(newInvoice(defaultDateTimeSettings), FORM_NAME);
export const initialState: State = {
form: initialForm,
dateTimeSettings: defaultDateTimeSettings,
};
const formReducerFn = (dateTimeSettings: DateTimeSettings) =>
createFormGroupReducerWithUpdate<Invoice>({
payments: updateArray<Payment>(
updateGroup<Payment>({
description: validate(customValidations.required),
amount: validate([
customValidations.required,
customValidations.double,
]),
}),
),
}); |
Pretty much what @nihique said, validate the items in the array but also that there's at least 1 which I managed to figure out myself. |
I've tried to copy your example and get:
with the model:
with code:
|
Yes, the typing for those update functions is a bit sub-optimal. This should do the trick: createFormGroupReducerWithUpdate<Template>({
name: validate<string>(required),
roles: roles => updateArray<TemplateRole>(
cast(roles),
updateGroup<TemplateRole>({
name: validate<string>(required)
}),
)
}); With the next version (which I'll release as soon as TypeScript 2.8 is finally released) your version will work due to improved type inference for child controls. I will also clean up the update functions in general to be more consistent. In regards to combining validation of array items with the whole array you would write the following: createFormGroupReducerWithUpdate<Template>({
name: validate<string>(required),
roles: roles => {
roles = validate<TemplateRole[]>(minLength(1), roles);
return updateArray<TemplateRole>(
cast(roles),
updateGroup<TemplateRole>({
name: validate<string>(required)
}),
);
}
}); |
That works thanks. But. if you add another property to validate inside the updateArray, updateGroup or add another updateGroup you get the error again. I can't seem to find the right combination to validate multiple properties inside the array:( |
Sorry for the late response. I hope you were able to find the right combination in the meantime. If not, to work around these typing issues (which I am in the process of fixing properly) you can always make the createFormGroupReducerWithUpdate<Template>({
name: validate<string>(required),
roles: roles => {
roles = validate<TemplateRole[]>(minLength(1), roles);
return updateArray<TemplateRole>(
cast(roles),
// by making the `role` state parameter explicit we ensure that the
// TypeScript compiler chooses the right overload
role => updateGroup<TemplateRole>(cast(role), {
name: validate<string>(required)
}),
);
}
}); |
Alright, so in the new and shiny TypeScript 2.8 world the following will type check: interface Template {
name: string;
roles: TemplateRole[];
}
interface TemplateRole {
name: string;
}
createFormGroupReducerWithUpdate<Template>({
name: validate(required),
roles: compose(
validate<TemplateRole[]>(minLength(1)),
updateArray(
updateGroup<TemplateRole>({
name: validate(required),
}),
),
),
}); As far as I know Angular plans to drop TypeScript 2.8 support sometime in May at which point I will also release version 3.0.0 of ngrx-forms. I'll close this issue once that happens. |
I have just released version 3.0.0. The code above should now properly type check. |
I've been digging through the example app and docs but I can't see an example of how to validate an array of objects?
The text was updated successfully, but these errors were encountered: