Message error in custom position targetSelector about ngx-validate HOT 4 CLOSED

Hi @begandroide,

targetSelector is passed to InjectionToken as value and is being processed here:

I have forked the demo app, upgraded it to Angular 9 and changed the targetSelector to .form-control:

https://stackblitz.com/edit/ngx-validate-c6biws?file=src%2Fapp%2Fapp.module.ts

As you can see, a solid border replaces the dashed border. This is because, is-invalid class is placed on the form control instead of the form group. You can see the styling here:

https://stackblitz.com/edit/ngx-validate-c6biws?file=src%2Fstyles.css

If you set targetSelector back to .form-group, the dashed border will return.

Please let me know if this answer is clear to you.

P.S. Ivy is not enabled in the demo, because explicit generic type for ModuleWithProviders is not applied in this library yet and that is a breaking change when Ivy is enabled.

from ngx-validate.

I think placing validationTarget on div.mat-form-field-wrapper should insert the error component exactly where you wish it to be.

Sorry for missing documentation and features. We have not been able to invest our time in this repo so far, but we intend to do so very soon.

from ngx-validate.

Thank you very much !! works for me 😄

from ngx-validate.

Hi @armanozak, thanks you very much for the quick response. I understood that is-invalid class is placed on the targetSelector, thanks for that. Now the principal problem is that i want place the custom component in a special place (below class mat-form-field-flex), and the custom error component still placing below of invalid target.

from ngx-validate.