Bind Input [Group] validity directly to ngModel so it responds better to changes through API

[damyanpetev]

Preface: The visual validity of a control (as displayed to the user) is a combination of the status and usually either dirty or touched, per Form Validation.

Is your request related to a problem? Please describe.

Updating FormControl properties such as touched/dirty through API (like you might to trigger manual form validation) won't reflect in the Input and Group state, despite causing other validation messages to be displayed.

Currently the validity of the igxInput (and thus the Input Group) is updated based on the AbstractControl.statusChanges. And blur. And focus.

igniteui-angular/projects/igniteui-angular/src/lib/directives/input/input.directive.ts

Lines 211 to 213 in 7e91e63

	if (this.ngControl) {
	this._statusChanges$ = this.ngControl.statusChanges.subscribe(this.onStatusChanged.bind(this));
	}

However, this doesn't quite cover the condition for validity and there are no other events for changes in touched/dirty control state.

Describe alternatives you've considered

An additional call to updateValueAndValidity to ensure the event is emitted and the Input updates: #4756 (comment).

Describe the solution you'd like

While that's not a major issue, it'd be better if we do away with the subscription and directly bind the input validity and group styling to the ngModel properties.

Additional context

Because the initial value bind already determined the status, the ngModel control starts out as pristine and invalid and so igxInput.valid is IgxInputState.INITIAL.
At this point calling markAsTouched() or markAsDirty() technically completes the requirement for a visual error (and error messages do appear), but there's no statusChanges so the input state and group styling remain initial.

[github-actions]

There has been no recent activity and this issue has been marked inactive.

[github-actions]

There has been no recent activity and this issue has been marked inactive.

[github-actions]

There has been no recent activity and this issue has been marked inactive.

[github-actions]

There has been no recent activity and this issue has been marked inactive.

[github-actions]

There has been no recent activity and this issue has been marked inactive.

[github-actions]

There has been no recent activity and this issue has been marked inactive.

[github-actions]

There has been no recent activity and this issue has been marked inactive.

[github-actions]

There has been no recent activity and this issue has been marked inactive.

[github-actions]

There has been no recent activity and this issue has been marked inactive.

[github-actions]

There has been no recent activity and this issue has been marked inactive.

[github-actions]

There has been no recent activity and this issue has been marked inactive.

[github-actions]

There has been no recent activity and this issue has been marked inactive.

[github-actions]

There has been no recent activity and this issue has been marked inactive.

[github-actions]

There has been no recent activity and this issue has been marked inactive.

[github-actions]

There has been no recent activity and this issue has been marked inactive.

[github-actions]

There has been no recent activity and this issue has been marked inactive.