Angular - HTTPClient put and post not working-CodePudding

I have multiple services in my Angular Ionic App all copies of each other with the slightest changes.

I have a method like this (delete/update/get all work):

endpoint = 'https://localhost:7183/api/CheckinData';
httpOptions = {headers: new HttpHeaders({ 'content-Type': 'application/json' })};

clockIn(time, date) {
  const reply = new CheckinData();
  reply.userid = 2; //placeholder untill better authentication implementation
  reply.time = time;
  reply.date = date;
  this.create(reply);
}

create(data: CheckinData): Observable<any> {
  console.log('clockin', this.endpoint, JSON.stringify(data));
  return this.http.post(this.endpoint, JSON.stringify(data), this.httpOptions)
    .pipe(catchError(this.handleError<CheckinData>('Error occured')));
}

I don't know if it is relevant but here is my CheckinData class:

export class CheckinData 
{
  id: number;
  time: Time;
  date: Date;
  userid: number;
}

console.log works with return (-> method gets called):

clockin https://localhost:7183/api/CheckinData {"userid":2,"time":"10 45 AM","date":"15 11 2022"}

There is no error.

But when I call get/ check in SSMS there is no new entry.

For example, this call works just fine (different service, different Api controller)

create(todo: ToDo): Observable<any> {
  console.log('createToDo', this.endpoint, JSON.stringify(todo));
  return this.httpClient.post(this.endpoint, JSON.stringify(todo), this.httpOptions)
    .pipe(catchError(this.handleError<ToDo>('Error occured')));
}

I can post with swagger/postman (-> API works).

I tried put instead of post and it doesn't work either.

There has to be another potential mistake I am missing.

If you have any ideas about what could be wrong/what else to check. All help is appreciated.

CodePudding user response：

From your code, I don't see your front-end side will submit the request to API. You need to subscribe the Observable in order to submit the request.

clockIn(time, date) {
  ...

  this.create(reply)
    .subscribe(x => {
      // Action after receive response from API
    });
}