Angular 8前端未将捕获的数据/字段发送到Go后端

Question

I am currently rewriting an application that will have an Angular 8 front end(Learning as I code) that will interact with a Go backend which will that connect to a MSSQL database. I can display my data from the DB successfully. However, when trying to update the data received, it looks like the fields/data are not being sent to the Go backend. I have tested the Go backend API using Postman and that works fine. Any suggestion on what could be wrong with the code below or what I can do to debug this ?

rest-api.service.ts

httpOptions = {
headers: new HttpHeaders({
  'Content-Type': 'application/json'
 //'Content-Type': 'Application-Token : this.getToken()' 
})
}  
updateDetails(ref, details): Observable<Details> {
return this.http.put<Details>(this.apiURL + '/details-edit/' + ref,    JSON.stringify(details), this.httpOptions)
.pipe(
retry(1),
catchError(this.handleError)
)
}

details-edit.component.ts

@Input() detailDetails = {  Ref: '', Name: '', Number: '', Trans_Date: '', Amount: '', Type: '', Reason: '', Code: '', Run_Date: ''}    Ref = this.actRoute.snapshot.params['Ref'];
detailsData: any = {};
constructor(
public restApi: RestApiService,
public actRoute: ActivatedRoute,
public router: Router
) { 
}
ngOnInit() { 
this.restApi.getDetails(this.Ref).subscribe((data: {}) => {
this.detailsData = data;
})
}
updateDetails(detailDetails) {
this.restApi.updateDetails(this.Ref, this.detailDetails).subscribe((data: {}) => {
this.router.navigate(['/details-list'])
})
}

details-component.html

<div class="form-group">
<input type="text" [(ngModel)]="details.Run_Date" class="form-control" placeholder="Run_Date">
</div>   
 <div class="form-group">
<button class="btn btn-success btn-lg btn-block" (click)="updateDetails()">Update Details</button>
</div>

I am expecting the captured\edited fields to used as values for my placeholders in my GO MSSQL query

Answer 1

In your .html you are using ngModel for details, but in your component.ts you have detailsData.

In your component.ts, updateDetails function has 1 parameter. Make sure using a console.log that the function is executed because you don't provide a parameter in .html

Also, I don't know if you expect on back-end to recieve a string. You should send your data through put without JSON.stringify.

I hope this helps.