Merge branch '9.0.x' into mkirova/fix-9.0.x-7234

Author: ChronosSF

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

@@ -494,6 +494,18 @@ describe('IgxInput', () => {
         expect(igxInput.valid).toBe(IgxInputState.INITIAL);
     }));
 
+    it('should correctly update enabled/disabled state of igxInput when changed via reactive form', fakeAsync(() => {
+        const fixture = TestBed.createComponent(ReactiveFormComponent);
+        fixture.detectChanges();
+        const igxInput = fixture.componentInstance.strIgxInput;
+
+        fixture.componentInstance.form.disable();
+        expect(igxInput.disabled).toBe(true);
+
+        fixture.componentInstance.form.get('str').enable();
+        expect(igxInput.disabled).toBe(false);
+    }));
+
     it('should style input when required is toggled dynamically.', () => {
         const fixture = TestBed.createComponent(ToggleRequiredWithNgModelInputComponent);
         fixture.detectChanges();

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

@@ -39,7 +39,7 @@ export enum IgxInputState {
  * @example
  * ```html
  * <input-group>
- *  <label for="address">Adress</label>
+ *  <label for="address">Address</label>
  *  <input igxInput name="address" type="text" [(ngModel)]="customer.address">
  * </input-group>
  * ```
@@ -289,6 +289,10 @@ export class IgxInputDirective implements AfterViewInit, OnDestroy {
      * @internal
      */
     protected onStatusChanged() {
+        // Enable/Disable control based on ngControl #7086
+        if (this.disabled !== this.ngControl.disabled) {
+            this.disabled = this.ngControl.disabled;
+        }
         if (this.ngControl.control.validator || this.ngControl.control.asyncValidator) {
             if (this.ngControl.control.touched || this.ngControl.control.dirty) {
                 //  TODO: check the logic when control is touched or dirty