Нужно 2 обещания в AppInitializer Angular 8

Question

Привет! Я создал функцию, которую необходимо загрузить до начала загрузки компонента. Для этого я использовал AppInitializer. Если я хочу загрузить одну функцию, она работает. Но мне нужны оба. И ngOnInit () или * ngIf также не будут работать, так как мне нужна эта функция до загрузки моего компонента. Вот мой app.service.ts

  detail1: any;
  detail2: any;

  getDetail1() {
    return this.detail1;
  }

  getDetail2() {
    return this.detail2;
  }

  loadDetail1() {
    return new Promise((resolve, reject) => {
      this.http.get<any>(URL1)
        .subscribe(detail1 => {
          this.detail1 = detail1['respObj'];
          resolve(true);
        });
    });
  }

  loadDetail2() {
    return new Promise((resolve, reject) => {
      this.http.get<any>(URL2)
        .subscribe(detail2 => {
          this.detail2 = detail2['respObj'];
          resolve(true);
        });
    });
  }

Как мне реализовать его во вложенной функции о том, как мне вызвать эту функцию перед загрузкой приложения. Пожалуйста, дайте знать, если у кого-нибудь есть идеи.

Answer 1

ngif будет работать, так как ngOnInit запускается до загрузки шаблона, я все равно буду использовать ngOnInit, вместо этого я подожду, пока оба запроса что-то испустят, сохранит значения в области видимости в одном Observable и будет использовать async pipe обрабатывает подписку, как таковую:

    details$: Observable<any>;

    ngOnInit() {
       this.details = combineLatest([
            this.http.get<any>(URL1),
            this.http.get<any>(URL2)
        ]);
    }

Затем в шаблоне:

    <div *ngIf="details$ | async as details">
       // do something with -details- as the values are stored in it
    </div>

ОбъединитьЛатест возвращает наблюдаемое, содержащее массив, который содержит значения ваших запросов get, значения хранятся в том же порядке [valuesURL1, valuesURL2].

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