Get object that was created on the server via Angular

Question

Good morning Personal,

I am a beginner in Angular 4 (using Typescript) and I have a basic question, but I did not find an answer here.

I have a typescript method that calls a method from a Webapi. This Webapi method creates an object and returns OK(objectCreated). I’m unable to recover the data from the object that had just been created. I would like to give a console.log of the object I created, but the first time saved, it gives Undefined and the second time, it brings the previously created object and not the last.

I know it’s a rookie mistake in technology, I’m sorry.

Follows my code:

Webapi Controller:

    [HttpPost]
    public Professor Create(Professor p)
    {
        //if (!ModelState.IsValid)
        //{
        //    BadRequest();
        //}
        IKernel ninjectKernel = new StandardKernel();
        ninjectKernel.Bind<IProfessorBLO>().To<ProfessorBLO>();
        IProfessorBLO blo = ninjectKernel.Get<IProfessorBLO>();

        blo.Add(p);

        //return Created(new Uri(Request.RequestUri + "/" + p.Id), p);
        return p;
    }

Method in Typescript:

  submit(form){
    let professor = form.value.professor;
    let response = this.service.create(form.value.professor);
    console.log(response);
  }

Method this.service.create:

  create(object){
    this.http.post(this.url,JSON.stringify(object), this.options)
    .subscribe(response=> {
      this.response = response;
    });
    return this.response.json();
  }

Answer 1

See that this.http.post is asynchronous, so that this.response may not have the value returned by the server when the function create end. A possible solution would be to pass a function of callback, to be executed when the response coming from the server reaches the client.

Method in Typescript:

submit(form){
  let professor = form.value.professor;
  this.service.create(form.value.professor,
    response=> console.log(response));
}

Method this.service.create:

create(object, callback){
  this.http.post(this.url,JSON.stringify(object), this.options)
  .subscribe(response=> {
    this.response = response;
    callback(response);
  });
}