javascript - async - Angular 2: cómo llamar a una función después de obtener una respuesta de suscribirse http.post

promise angular 6

Question

Necesito llamar a un método después de obtener los datos de la solicitud de publicación http

servicio: request.service.TS

get_categories(number){
this.http.post( url, body, {headers: headers, withCredentials:true})
.subscribe(
response => {
this.total = response.json();
}, error => {
}
);
}

componente: categorias.TS

search_categories() {
this.get_categories(1);
//I need to call a Method here after get the data from response.json() !! e.g.: send_catagories();
}

Solo funciona si cambio a:

servicio: request.service.TS

get_categories(number){
this.http.post( url, body, {headers: headers, withCredentials:true})
.subscribe(
response => {
this.total = response.json();
this.send_catagories(); //here works fine
}, error => {
}
);
}

Pero necesito llamar al método send_catagories() dentro del componente después de llamar a this.get_categories(1); Me gusta esto

componente: categorias.TS

search_categories() {
this.get_categories(1);
this.send_catagories(response);
}

¿Qué estoy haciendo mal?

Answer 1

Actualice su método get_categories() para devolver el total (envuelto en un observable):

// Note that .subscribe() is gone and I''ve added a return.
get_categories(number) {
return this.http.post( url, body, {headers: headers, withCredentials:true})
.map(response => response.json());
}

En search_categories() , puede suscribir el observable devuelto por get_categories() (o podría seguir transformándolo encadenando más operadores RxJS):

// send_categories() is now called after get_categories().
search_categories() {
this.get_categories(1)
// The .subscribe() method accepts 3 callbacks
.subscribe(
// The 1st callback handles the data emitted by the observable.
// In your case, it''s the JSON data extracted from the response.
// That''s where you''ll find your total property.
(jsonData) => {
this.send_categories(jsonData.total);
},
// The 2nd callback handles errors.
(err) => console.error(err),
// The 3rd callback handles the "complete" event.
() => console.log("observable complete")
);
}

Tenga en cuenta que solo se suscribe UNA VEZ , al final.

Como dije en los comentarios, el método .subscribe() de cualquier observable acepta 3 devoluciones de llamada como esta:

obs.subscribe(
nextCallback,
errorCallback,
completeCallback
);

Deben ser pasados ​​en este orden. No tienes que pasar los tres. Muchas veces solo se implementa el nextCallback :

obs.subscribe(nextCallback);

Answer 2

Puede agregar una función de devolución de llamada a su lista de parámetros get_category (...).

Ex:

 get_categories(number, callback){
this.http.post( url, body, {headers: headers, withCredentials:true})
.subscribe(
response => {
this.total = response.json();
callback();
}, error => {
}
);
}

Y luego puedes llamar a get_category (...) así:

this.get_category(1, name_of_function);

Answer 3

Puede codificar como una expresión lambda como el tercer parámetro (al completar) al método de suscripción. Aquí vuelvo a configurar la variable departmentModel a los valores predeterminados.

saveData(data:DepartmentModel){
return this.ds.sendDepartmentOnSubmit(data).
subscribe(response=>this.status=response,
()=>{},
()=>this.departmentModel={DepartmentId:0});
}

Answer 4

Puedes hacer esto usando un nuevo Subject también:

Mecanografiado:

let subject = new Subject();
get_categories(...) {
this.http.post(...).subscribe(
(response) => {
this.total = response.json();
subject.next();
}
);
return subject; // can be subscribed as well
}
get_categories(...).subscribe(
(response) => {
// ...
}
);

Answer 5

get_categories(number){
return this.http.post( url, body, {headers: headers, withCredentials:true})
.map(t=> {
this.total = t.json();
return total;
}).share();
);
}

entonces

this.get_category(1).subscribe(t=> {
this.callfunc();
});