Angular Forms In Depth

angular-university · Dec 15, 2020 · ac215d5 · ac215d5
1 parent c5ed8e2
commit ac215d5
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 0 deletions.
diff --git a/src/app/file-upload/file-upload.component.html b/src/app/file-upload/file-upload.component.html
@@ -1,2 +1,17 @@
 
+<input type="file" class="file-input">
 
+<div class="file-upload">
+
+    <mat-form-field>
+
+        <input matInput [disabled]="true" [value]="fileName">
+
+    </mat-form-field>
+
+    <button mat-mini-fab color="primary" class="upload-btn">
+        <mat-icon>attach_file</mat-icon>
+
+    </button>
+
+</div>
diff --git a/src/app/file-upload/file-upload.component.ts b/src/app/file-upload/file-upload.component.ts
@@ -15,4 +15,6 @@ export class FileUploadComponent {
     @Input()
     requiredFileType:string;
 
+    fileName = '';
+
 }
-Original file line number
+Diff line change
@@ Expand Up / @@ -15,4 +15,6 @@ export class FileUploadComponent { @@
         @Input()
         requiredFileType:string;
+        fileName = '';
     }