Merge pull request #12963 from IgniteUI/simeonoff/fix-12894-16.0.x

fix(input): file name(s) not cleared on form reset

Author: kdinev

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

@@ -99,6 +99,7 @@ export class IgxInputDirective implements AfterViewInit, OnDestroy {
 
     private _valid = IgxInputState.INITIAL;
     private _statusChanges$: Subscription;
+    private _valueChanges$: Subscription;
     private _fileNames: string;
     private _disabled = false;
 
@@ -305,6 +306,10 @@ export class IgxInputDirective implements AfterViewInit, OnDestroy {
             this._statusChanges$ = this.ngControl.statusChanges.subscribe(
                 this.onStatusChanged.bind(this)
             );
+
+            this._valueChanges$ = this.ngControl.valueChanges.subscribe(
+                this.onValueChanged.bind(this)
+            );
         }
 
         this.cdr.detectChanges();
@@ -314,6 +319,10 @@ export class IgxInputDirective implements AfterViewInit, OnDestroy {
         if (this._statusChanges$) {
             this._statusChanges$.unsubscribe();
         }
+
+        if (this._valueChanges$) {
+            this._valueChanges$.unsubscribe();
+        }
     }
     /**
      * Sets a focus on the igxInput.
@@ -345,6 +354,14 @@ export class IgxInputDirective implements AfterViewInit, OnDestroy {
         }
         this.updateValidityState();
     }
+
+    /** @hidden @internal */
+    protected onValueChanged() {
+        if (this._fileNames && !this.value) {
+            this._fileNames = '';
+        }
+    }
+
     /**
      * @hidden
      * @internal