Quiero activar los datos de carga (que también se cargan en init) cuando el usuario cierra el cuadro de diálogo.
en AddUser-component.ts tengo alguna lógica y solo una parte importante
public onClose: Subject<any> = new Subject<any>(); this.addService.addNewUser(user).subscribe(res => { this.onClose.next(res.body) this.bsModalRef.hide(); }y cuando active esto en el componente principal AllUser-components.ts tengo
public addNewUser() { this.bsModalRef = this.modalService.show(AddUserComponent); (this.bsModalRef.content as AddUserComponent).onClose.subscribe(singleUserFromChildComponent)=>{ this.loadUser(); // HERE IS PROBLEM... when i console.log this.allUsers i don't see new added user ..... if (bill) { this.lastAddedItem(this.allUsers, singleUserFromChildComponent); } this.bsModalRef.hide() }) }y arriba tengo loadUser
private loadUser() { this.service.getAllUsers( ).subscribe((res) => { this.allUsers = res.body!; }) }this.allUsers var no está actualizado... no carga nuevo usuario... ¿por qué? Cargo datos y todos los usuarios deben actualizarse con nuevos datos
this.allUsers = res.body!;pero no... no sé por qué?
Bueno, es porque el método loadUser() es asíncrono, y mientras lo carga en el cierre modal, aún no finaliza (también tener suscripciones anidadas es una especie de mala práctica, puede leer más en ese hilo ¿Por qué la suscripción anidada no es bueno? )
Lo que puedo sugerirte es eliminar la invocación de suscripción del método loadUser y devolver solo un observable:
private loadUser() { return this.service.getAllUsers().pipe(map((res: any) => res.body!),tap((res: any) => this.allUsers = res)); }En su OnInit (o método constructor, inicialice todos los usuarios de esta manera.
this.loadUser().pipe(first()).subscribe();y luego refactorice su parte de cierre modal con switchMap (esperará hasta que termine su servicio. getAllUsers)
public addNewUser() { this.bsModalRef = this.modalService.show(AddUserComponent); (this.bsModalRef.content as AddUserComponent).onClose .pipe(tap(singleUserFromChildComponent => this.singleUserFromChildComponent = singleUserFromChildComponent), switchMap(addedUser => (this.loadUser()))).subscribe(_ => { if (bill) { this.lastAddedItem(this.allUsers, this.singleUserFromChildComponent); } this.bsModalRef.hide() }); }también agregue la propiedad lastAddedUser a su componente
public singleUserFromChildComponent: any;