Angular 2 - ожидание, пока служба получит информацию - возврат обещания, когда установлена ​​переменная

основной app.component запрашивает данные из веб-сервиса

затем он устанавливает переменную в службе с именем ядроСервис, которая везде внедряется для доступа к этим данным.

проблема в том, что другие компоненты загружаются до app.component получает информацию, поэтому я получаю массу неопределенных проблем

  • Я не извлекаю данные из coreService, иначе веб-сервис вызывается несколько раз (пытался использовать условие и канал(), но он не работает)

  • Я пытался использовать AfterViewInit, но он работает с перебоями.

приложение.компонент:

ngOnInit() {
    this.catalogService.getCampaign().then((data: any) =>
    {
        this.coreService.campaign=data;
    });
}

products.component: (компонент, загружаемый в роутер)

constructor(private coreService:CoreService)
{}

ngAfterViewInit()
{
    Promise.resolve(null).then(() => {   // to avoid value changed error b@#!t from angular
        if (this.coreService.campaign)
        {
                        ... // we should be here                
        }
        else
        {
            console.dir(this.coreService);
            throw "campaign not loaded yet";
        }
    });
}

Я хочу, чтобы два компонента были синхронизированы, я имею в виду, что компонент продукты должен ждать, пока ядроСервис получит свои данные.

это не определено в цепочке, затем:

@Injectable({
  providedIn: 'root'
})
export class AppResolver implements Resolve<boolean> {

  constructor(private catalogService: CatalogService, private coreService:CoreService) { }

  public resolve(route: ActivatedRouteSnapshot): Promise<boolean> 
  {
    return this.catalogService.getCampaign(CoreService.CAMPAIGN_IDENTIFIER,null).then((data: any) => 
    {
        this.coreService.campaign=data;
        return true;
    })
    .then(function(result) : Promise<boolean>
    {
        // below this is undefined and throws an error
        //////////////////////////////////////////////
        return this.catalogService.getCampaign(CoreService.CAMPAIGN_IDENTIFIER,null).then((data: any) => {
            this.coreService.campaign=data;
            return true;
        });
    });
  }
}
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Angular и React для вашего проекта веб-разработки?
Angular и React для вашего проекта веб-разработки?
Когда дело доходит до веб-разработки, выбор правильного front-end фреймворка имеет решающее значение. Angular и React - два самых популярных...
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Мы провели Twitter Space, обсудив несколько проблем, связанных с последними дополнениями в Angular. Также прошла Angular Tiny Conf с 25 докладами.
Угловой продивер
Угловой продивер
Оригинал этой статьи на турецком языке. ChatGPT используется только для перевода на английский язык.
Мое недавнее углубление в Angular
Мое недавнее углубление в Angular
Недавно я провел некоторое время, изучая фреймворк Angular, и я хотел поделиться своим опытом со всеми вами. Как человек, который любит глубоко...
Освоение Observables и Subjects в Rxjs:
Освоение Observables и Subjects в Rxjs:
Давайте начнем с основ и постепенно перейдем к более продвинутым концепциям в RxJS в Angular
0
0
95
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

вы должны получить данные в Резольвер.

@Injectable({
  providedIn: 'root'
})
export class MyDataResolverService implements Resolve<boolean> {

  constructor(private catalogService: CatalogService, private coreService:CoreService) { }

  public resolve(): Promise<boolean> {
    return this.catalogService.getCampaign().then((data: any) => {
        this.coreService.campaign=data;
        return true;
    });
  }
}

затем используйте преобразователь в конфигурации маршрута

...
  {
    path: '',
    component: AppComponent,
    resolve: {
      dataResolved: MyDataResolverService
    }
  }
....

маршрут должен быть добавлен в модуль маршрутизации приложений? У меня нет записи для этого

user7082181 14.06.2019 13:47

У меня ошибка с route(), я не понимаю, почему она не работает.... Я обновил свой вопрос изображением

user7082181 14.06.2019 13:54

ошибка с route () - это моя ошибка, «класс экспорта MyDataResolverService реализует Resolve <ture>» должен был быть «класс экспорта MyDataResolverService реализует Resolve <boolean>». я обновил свой пост. маршрут, который я добавил, является просто примером, показывающим, как это делается, это не точная реализация, подходящая для вашего конкретного варианта использования, поскольку я не знаю, как вы обрабатываете маршрутизацию. вам следует добавить преобразователь в соответствующее место в конфигурации вашего маршрута, например, туда, где вы направляетесь к products.component. если вы добавите свою конфигурацию маршрута, я могу помочь.

ysf 14.06.2019 14:22

Хорошо, это строится, но что, если мне нужно связать множество запросов веб-сервисов, прежде чем выполнять разрешение, и они зависят друг от друга?

user7082181 14.06.2019 14:36

вы должны связывать промисы в resolve(), как описано здесь javascript.info/обещание-цепочка

ysf 14.06.2019 14:54

Я рад, что это помогает. пожалуйста, не забудьте проголосовать и принять ответ.

ysf 14.06.2019 14:57

Затем я попытался добавить второй, но внутри него это не определено, я думаю, мне следует использовать привязку, но я подозреваю, что делаю что-то не так, я обновил свой вопрос

user7082181 17.06.2019 08:01

Я возвращаю это из одного обещания в другое, я обнаружил, что также могу сделать ()=>это.что-то.. но мне не нравится синтаксис

user7082181 17.06.2019 08:21

вы должны использовать синтаксис толстой стрелки. в противном случае вы получите неопределенную ошибку для «этого». есть раздел "Что это?" в этой статье hacks.mozilla.org/2015/06/es6-глубинные-стрелочные-функции взгляните на нее.

ysf 17.06.2019 09:35

Другие вопросы по теме