HTML
<div class="col-md-6">
<div class="col-md-12">
<br>
<br>
<div class="form-group">
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text">NID Image</span>
</div>
<div class="custom-file">
<input type="file" class="custom-file-input" #file
name="imageFile" (change)="fileChange($event)"
id="inputGroupFile01"
>
<label class="custom-file-label" for="inputGroupFile01">{{FilePath}}</label>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="row">
<div class="col-md-3">
</div>
<div class="col-md-6">
<div class="card" >
<div class="el-card-item">
<div class="el-card-avatar el-overlay-1">
<img [src]="nidImageData" alt="user" width="200" height="100">
</div>
<div class="el-card-content">
<br>
</div>
</div>
</div>
</div>
<div class="col-md-3">
</div>
</div>
</div>
TypeScript
file: File
FilePath: string='Choose file';
nidImageData:string;
fileChange(event) {
let fileList: FileList = event.target.files;
if (fileList.length > 0) {
this.file = fileList[0];
this.FilePath = this.file.name;
//let fileSize: number = fileList[0].size;
//if (fileSize <= 10485760) {
//}
//else {
// this.alertService.error("File size is exceeded");
//}
const reader = new FileReader();
reader.readAsDataURL(this.file); // toBase64
reader.onload = () => {
this.nidImageData = reader.result as string; // base64 Image src
};
}
else {
this.alertService.error("Something went Wrong.");
this.FilePath ='Choose file';
}
}
let formData: FormData = new FormData();
formData.append('Document', this.file);
this._http.post<Result>(this.env.apiUrl + url, formData).subscribe(result => {
console.log(result);
this.resultMaster = result;
if (this.resultMaster.Status == true) {
console.log(this.resultMaster);
// this.designationList = JSON.parse(this.resultMaster.Data);
this._alertService.success('Data Saved Successfully');
this._file.nativeElement.value = '';
this.model = new ProductSetup();
this.rerender();
} else {
this._alertService.error(this.resultMaster.Message);
//window.scroll(0, 0);
}
}, error => {
this._alertService.error(error);
//window.scroll(0, 0);
});
.NET CORE API
[Authorize(Policy = nameof(Policy.Account))]
[HttpPost("create")]
public ActionResult Create() //[FromBody] Supplier request
{
try
{
var DocumentMain = JsonConvert.DeserializeObject<Supplier>(Request.Form["DocumentMain"].ToString());
var DocumentDoc = JsonConvert.DeserializeObject<SupplierDoc>(Request.Form["DocumentDoc"].ToString());
if(Request.Form.Files.Count > 0)
{
foreach(var d in Request.Form.Files)
{
IFormFile file = d;
switch (file.Name)
{
case "Document1":
using (var ms = new MemoryStream())
{
file.CopyTo(ms);
DocumentDoc.TradeFile = ms.ToArray();
DocumentDoc.TradeFileType = file.FileName;
}
break;
...............
.....................
