При попытке отладки или выполнения происходит сбой после ввода метода API и выполнения команды Request.Form.Files
Это мой html шаблон в Angular:
<form [formGroup]="myForm" (ngSubmit)="updateDetails()" style="margin-top:50px;align-items: center;justify-content: center;" >
<div class="form-row" style="justify-content: center;">
<div class="form-group col-md-6">
<label for="Image">Image</label>
<input formControlName="image" name="Image" type="file" class="form-control"
(change)="onFileChange($event)">
</div>
</div>
<div class="form-row" style="justify-content: center;">
<div class="form-group col-md-6">
<label for="JobPosition">Job Position</label>
<input formControlName="jobPosition" name="JobPosition" type="text" class="form-control" placeholder="Job Position" >
</div>
</div>
<div class="form-row" style="justify-content: center;">
<div class="form-group col-md-6">
<label for="City">City</label>
<input formControlName="city" name="City" type="text" class="form-control" placeholder="City">
</div>
</div>
<div class="form-row" style="justify-content: center;">
<div class="form-group col-md-6">
<label for="Description">Description</label>
<textarea formControlName="description" name="Description" type="text" class="form-control" placeholder="Description"> </textarea>
</div>
</div>
<div class="form-row" style="justify-content: center;">
<button type="submit" class="btn btn-info btn-circle btn-xl"><i class="fa fa-check"></i>
</button>
</div>
</form>
Это форма, в которую я передаю значения:
myForm = new FormGroup({
city: new FormControl(''),
jobPosition:new FormControl(''),
description:new FormControl(''),
image: new FormControl(''),
imageSource: new FormControl('')
});
Метод OnChangeFile, используемый при изменении загрузки файла
onFileChange(event:any) {
if (event.target.files.length > 0) {
const file = event.target.files[0];
this.myForm.patchValue({
imageSource: file
});
this.myForm.get('imageSource').updateValueAndValidity()
// File Preview
const reader = new FileReader();
reader.onload = () => {
this.preview = reader.result as string;
}
reader.readAsDataURL(file)
}
}
Моя форма метод инициализации:
updateDetails(){
let input = new UserUpdateModel(this.myForm.get('jobPosition').value,this.myForm.get('city').value,this.myForm.get('description').value,this.myForm.get('imageSource').value);
const formData = new FormData();
formData.append('file',this.myForm.get('image').value);
this.userService.updateUser(this.user.id,input,formData).subscribe((result)=>{
this.alertify.success('Done !');
},error=>{
this.alertify.error('Error!');
})
}
}
метод обслуживания пользователя
updateUser(id:string,input:UserUpdateModel,formData:any){
return this.http.post(this.baseUrl+id,input);
}
и метод API в ASP. NET CORE:
[HttpPost("{id}")]
public async Task<IActionResult> UpdateUser(string id, [FromBody]UserUpdateModel input)
{
var files = Request.Form.Files;
var filePath = this.fileService.UploadFile(files);
return Ok();
}