Angular 2 Reactive form Validator - how to allow null, but when there is input, the input need to be number?

Question

I have this forming group like so:

   channelInfo: this.fb.group({
    youTubeSubs: [null, [Validators.required, CustomValidators.number]],
    instagramFollowers: [null],
    twitterFollowers: [null],
    snapchatFollowers: [null],
    facebookLikes: [null]
  }),

Only the youTubeSubs is required, all the other number is optional. But if there is value, I need to make sure the value to be number using the CustomValidators.number provide by this component: Angular2 Validator

How can I allow null and number validator at the same time? So if value is empty null, it will show error. But if there is value, the error will show if the value is not number?

I think the empty error is caused by Validators.required. See this Demo — Lon Yang
– Lon Yang, Commented Mar 22, 2017 at 1:36

cozmik05 · Accepted Answer · 2018-03-06 12:46:54Z

2

Just remove the Validators.required when validating the other fields like so..

channelInfo: this.fb.group({
    youTubeSubs: [null, [Validators.required, CustomValidators.number]],
    instagramFollowers: [null, [CustomValidators.number]],
    twitterFollowers: [null, [CustomValidators.number]],
    snapchatFollowers: [null, [CustomValidators.number]],
    facebookLikes: [null, [CustomValidators.number]]
}),

answered Mar 6, 2018 at 12:46

cozmik05

5175 silver badges13 bronze badges

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

Collectives™ on Stack Overflow

Angular 2 Reactive form Validator - how to allow null, but when there is input, the input need to be number?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related