Как отключить вращающийся мат, когда я получаю уведомление об успешной работе / отказе от серверной части

Question

У меня есть асинхронная работа, выполнение которой занимает много времени.Когда задание начинает выполняться, я установил спиннер и установил тайм-аут на 60000 миллисекунд.Но теперь у нас есть служба уведомлений, которая сообщает статус выполнения задания.Я хочу отключить счетчик при получении сообщения независимо от того, было ли выполнено задание неудачным / пройдено.

Код счетчика с тайм-аутом: -

 this.recommendationService
                    .executeCustomerOpportunityMapper(opportuniyMapperJson)
                    .subscribe(
                        response => {
                            this.isExecuteOppRanking = true;
                            this.snakbar.statusBar(
                                "Executing customer opportunity ranking",
                                "Success"
                            );
                            this.spinner.show();
                            setTimeout(() => {
                                this.spinner.hide();

this.loadRankedOpportunities(tableMetadata);
                                this.selectedIndex = 3;
                                this.isExecuteOppRanking = false;
                            }, 60000);

Служба уведомления о сообщениях: -

this.messageService.messageReceived$.subscribe(data => {
        this.snakbar.statusBar("Platform job status - " + data, "Info");

    });

Я хочу, чтобы мой счетчик тайм-аут, когда messageService получает уведомление об успехе / сбое, а не тайм-аут после 60000 мс.

Answer 1

Я предполагаю, что обе ваши подписки находятся в одном и том же компоненте. Если вы хотите остановить спиннер, можете ли вы переместить spinner.hide() к другой подписке?

this.messageService.messageReceived$.subscribe(data => {
    this.snakbar.statusBar("Platform job status - " + data, "Info");
    if (data === "done") { // somehow check the status if necessary
        this.spinner.hide();
        this.loadRankedOpportunities(tableMetadata);
        this.selectedIndex = 3;
        this.isExecuteOppRanking = false;
    }
});

this.recommendationService
    .executeCustomerOpportunityMapper(opportuniyMapperJson)
    .subscribe(response => {
        this.isExecuteOppRanking = true;
        this.snakbar.statusBar(
            "Executing customer opportunity ranking",
            "Success"
        );
        this.spinner.show();
     });