Question

我正在构建一个离子2 rc0应用程序。我的rootPage取决于在启动App之前必须加载的一些配置。我在整个应用程序中使用了名为 Config 的提供程序。在构建 Home 页面组件之前，如何延迟/等待加载配置。我需要Home的构造函数中的配置。是吗？像离子的预加载模块那样的情况呢？

这甚至是这类任务的最佳位置吗？

我的配置模块使用

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

将json文件本地加载到我的Config提供程序的数据对象中。我在 app.component.ts 中的代码会触发一个函数config.loadDefault（）来从应用程序的 config.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(() => {
    ...
    });
  }
}

Answer 1

在我收回我的承诺回复之前没有定义rootPage，我可以阻止我的主页的构造函数被解雇。

$('.ranges ul li').eq(0).text(lang[0]);
$('.ranges ul li').eq(1).text(lang[1]);

然后在 then（）块内，我可以设置我的应用程序的rootPage。

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

Answer 2

我不确定这是最好的方法。但有一个选择是在加载数据后隐藏启动画面。

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();
    });
  }

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

2 个答案: