Инициализация приложения Angular с помощью Observables

У меня есть это приложение, которое нуждается в некоторой инициализации перед запуском. Я использую рекомендуемый способ с APP_INITIALIZER, фабричной функцией и т. д., а также синтаксисом фабричной функции, который позволяет использовать наблюдаемые объекты вместо промисов.

init.service.ts

      ...
constructor(private http: HttpClient){}
...
public init(){
  return this.http.get(url).subscribe((data) => {
    // save data in local variables
  });
}
...

app.module.ts

      ... 
export function initializeApp(initService: InitService) {
  return () => initService.init(); // this should convert the Obs into a Promise before return
}
...
providers: [
  {
    provider: APP_INITIALIZER,
    useFactory: initializeApp,
    deps: [InitService],
    multi; true
  }
]
...

Теперь это не работает, а это означает, что приложение запускается (рендеринг компонентов и все остальное) до завершения инициализации.

Насколько я понимаю, проблема в том, что функцияinit()должен возвращать наблюдаемый объект. Тем не менее, я хочу,.subscribe()часть, которая должна быть определена внутри сервисной функции. Есть ли способ подписаться на Observable и вернуть объект Observable в той же строке? (просто предваряяreturnкак у меня не получилось)

Я предполагаю, что это единственное, чего не хватает, так как провайдер гарантирует, что обещание будет разрешено перед запуском приложения?

Спасибо за любую помощь,

--Томас

2 ответа

ОжидаетObservable, Так что вашиInitServiceнужно будет просто отобразить данные ответа вместо подписки.

        return this.http.get(url).pipe(map(data) => {
    // save data in local variables
  }));

Вот рабочий пример -APP_INITIALIZERв этом примере будет предварительно загружен случайный факт о кошках в локальное хранилище. AppComponentЗатем можно прочитать этот факт из локального хранилища при инициализации и отобразить его, не дожидаясь.

По-видимому, тривиальное решение моего вопроса

      public init(): Observable<any>{
  let obs this.http.get(url);
  obs.subscribe((data) => {
    // save data in local variables
  });
  return obs;
}

Вероятно, не полностью соответствует лучшим практикам Observables, но пока, похоже, работает.

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