Option to have .is-invalid (or custom class) applied to the form-control when form is invalid

[not-a-doctor-stromberg]

Would it be possible to put a boolean on the component that apply the .is-invalid (or some other custom class) to the form-control element if the associated Angular FormControl is invalid? This would allow the following bootstrap rule to apply:

.was-validated .form-control:invalid, .form-control.is-invalid, .was-validated
.custom-select:invalid,
.custom-select.is-invalid {
  border-color: #dc3545;
}

As is, I am left creating a style like so to replicate the above rule:

.ng-invalid>div.ngx-select>div>div.form-control {
    border-color: $danger !important;
}

I can open an issue against the ng2-select component if you prefer -- I'm not sure if this is regularly updated from that or not :)

Thanks for the component though!

[optimistex]

@BloodChiefStromberg Unfortunately I am too busy and can not promise to solve it in soon. But, you can make a fix and make a pull request. I'll check and release it.

[not-a-doctor-stromberg]

I am in a similar boat :) I'll let you know if I find the time to make the PR.

Thanks again!

[falco442]

I'm trying to make it, but I don't see the @input formControl, the one that I use to set the component! How the component see formControl???

[optimistex]

@falco442 Check this:

ngx-select-ex/src/app/lib/ngx-select/ngx-select.component.ts

Line 68 in 9a414f3

export class NgxSelectComponent implements INgxSelectOptions, ControlValueAccessor, DoCheck, AfterContentChecked, OnDestroy {

It implements the interface ControlValueAccessor:
https://angular.io/api/forms/ControlValueAccessor