How to wait for a method set inside signalStore to finalize

I'm starting an angular application using ngrx signal, I've defined some methods, but I can't get my component code to wait for that method to finish

Store

export const OperationStore = signalStore(
withState(operacaoStoreInitialState),
withMethods((store, service = inject(OperationService)) => ({
changeStatus: async (id: string, statusId: string) => {
service.changeStatus(id, statusId)
.subscribe({
next: (data) => {
console.log('2')
...some logic
patchState(store, (state) => ({ data, loading: false }));
console.log('3')
},
error: (e) => {
...some logic
}
})
}
})),


Service

changeStatus(id: string, statusId: string) {
return this.http.patch<IResponse>(`${this.baseUrl}/${id}/status/${statusId}`, null)
}


Component

onFinalizar(id: string, statusId: string) {
this.finalizandoOperacao = true
this.habilitarBotoes = false
console.log('1')
this.operacaoStore.changeStatus(id, statusId)
console.log('4')
...Here there would be a logic to be executed only when the above method was finished
}


I tried a few solutions but none of them worked. I tried async, await, promise.all

Always the order of the console output is 1, 4, 2 and 3 and I need the console output to be 1, 2, 3 e 4

Continue reading...