Rxjs подписка не работает при подписке на Behavior Subject в базовом классе

Question

В настоящее время я использую Angular 7.

Я пытаюсь реализовать базовый http-сервис, чтобы я мог обрабатывать каждую ошибку и показывать загрузочные гифки абсолютно одинаково.Итак, у меня есть базовый сервис, который расширяет все мои сервисы;как только http-запрос сделан, я обновляю свою тему поведения, которую загружает страница.Я подписываюсь на это BehaviorSubject в моем app.component.ts, но здесь оно никогда не срабатывает.Посмотрев онлайн, все считают, что моя базовая http-служба не является одноэлементной, а мой app.component.ts подписывается на другой экземпляр базовой службы.

Я создал небольшой пример на SlackBlitz здесь .

Когда вы нажимаете кнопку «Изменить showLoading», моя подписка работает нормально в классе BaseServiceServiceно никогда не запускается в app.component?

Что я делаю не так?

Answer 1

Это не имеет ничего общего с синглтоном, но предложения о другом экземпляре верны, я постараюсь объяснить шаг за шагом.

это два экземпляра (BaseServiceService, FileServiceService), которые вы ввели в app.component.tsконструкторы разные и инициализируются независимо, поэтому this.fileService.callBase ();не будет взаимодействовать / запускать this.baseService.showLoading BehaviourSubject: если вы измените this.baseService.showLoading.subscribe(x => console.log('new val: ' + x)); эту строку на this.fileService.showLoading.subscribe(x => console.log('new val: ' + x));, она будет работать так, как вы ожидали, теперь вы можете просто удалить private baseService: BaseServiceService инъекцию из конструктора и BaseServiceService из providers: [FileServiceService, BaseServiceService]

---- Отредактировано ----

Думаю, я понимаю, что вы намереваетесь сделать, поэтому я изменила ваше демо.вот ссылка https://stackblitz.com/edit/angular-r2wv24

Answer 2

Ваш класс FileService расширяет класс BaseService, что означает, что оба класса будут иметь свойство showLoading.

Только ваша служба FileService вызывается с помощью метода callBase(), что означает, что только свойство showLoading из вашего FileService будет уведомлено о любых изменениях.

Я изменил эту строку в вашем app.component.ts, чтобы подписаться на FileService вместо BaseService, и она работает как задумано.

this.fileService.showLoading.subscribe(x => console.log('new val app: ' + x));

Полагаю, вы хотели, чтобы какая-то абстрактная служба определяла ваш showLoading на более высоком уровне?