Generally, you can bind the data for text type inputs and get the values using form instance. In the case of file type inputs, the value from form instance is always null, which can be retrieved in input element event handler using $event.target.files. Because, the DefaultValueAccessor is used to update the value of bounded element into $event.target.value.
Use the event handler in your application to process the file type inputs. Here, the change event is bounded to the input element, in which you can get the file details in event arguments ($event.target.files).
[app.component.html]
[app.component.ts]
Send data using HTTP to server
Send the form data to server (MVC controller) using http post() method. To send file data, convert the files to base64 string format. Refer to the following code snippet. [app.component.ts]
[app.component.html]
MVC server application
1. Create a MVC Project in Visual Studio. 2. Define the UserModel in HomeController.cs which is equivalent to form data values. Refer to the following code snippet for controller.
[HomeController.cs]
While submitting the form, you can get the form data in controller like the following image.
Sample links: |
This page will automatically be redirected to the sign-in page in 10 seconds.