在开始构建/加载rootPage之前加载配置



我正在构建一个ionic 2 rc0应用程序。我的rootPage依赖于一些配置,我必须在启动我的应用程序之前加载。我在整个应用程序中使用一个名为Config的提供商。我如何才能延迟/等待,直到配置加载之前构建我的Home页面组件。我需要Home的构造函数中的配置。有没有像ionic的预加载模块那样的东西来处理这种情况?

那是执行这种任务的最佳地点吗?

我的Config模块使用

http.get(../assets/config/config.json) .toPromise() .then(res => this.data = res);

将json文件本地加载到配置提供程序的数据对象中。我在app.component.ts中的代码会触发config. loaddefault()函数,从配置中加载这些默认设置。应用程序的json文件.....

app.components.ts

import { Component } from '@angular/core';
import { Platform } from 'ionic-angular';
import { StatusBar } from 'ionic-native';
import { Home } from '../pages/home/home';
import { Config } from '../providers/config/config';
@Component({
  template: `<ion-nav [root]="rootPage"></ion-nav>`
})
export class LoddenApp {
  public rootPage = Home;
  constructor(
    public platform : Platform,
    public config   : Config
  ){
    // loading config
    config.loadDefault()
      .then(data => {
        console.log(data);
        return config.loadSettingsFromDB();
      })
      .catch(err => {
        console.log("error occured while loading config:");
        console.log(err);
      });

    platform.ready().then(() => {
    ...
    });
  }
}

通过不定义rootPage,直到我得到我的承诺响应,我可以阻止我的主页的构造函数触发。

...
export class LoddenApp {
  public rootPage : any; // hold back
  constructor(
...

然后在 Then ()块中,我可以设置应用程序的rootPage。

this.rootPage = Home; // Home is the Homepage component

我不确定这是最好的方法。但是有一个选择是在你的数据加载后隐藏闪屏。

import {Splashscreen} from 'ionic-native';
constructor(
    public platform : Platform,
    public config   : Config
  ){
    platform.ready().then(() => {
      // loading config
      config.loadDefault()
       .then(data => {
        console.log(data);
        return config.loadSettingsFromDB();
      })
      .catch(err => {
        console.log("error occured while loading config:");
        console.log(err);
      });
      Splashscreen.hide();
    });
  }

最新更新