代码之家  ›  专栏  ›  技术社区  ›  arun kumar

离子2-ngOnInit事件-获取存储问题

  •  1
  • arun kumar  · 技术社区  · 8 年前

    我在存储器中存储用户id,并在加载页面时尝试获取存储的id。

    下面是代码片段

    constructor(
      private nav: NavController, 
      private auth: AuthService,
      public clockservice: ClockService,
      private alertCtrl: AlertController,
      private loadingCtrl: LoadingController,
      public storage: Storage
    ) {
    
      storage.get('name').then(val => {
        this.username = val; 
      })
    
      storage.get('id').then(val => {
        this.userid = val;     
        console.log(this.userid);
      })
    }
    
    ngOnInit() {    
      console.log("inside");
      console.log(this.userid); 
      getStatus();
    }
    
    getStatus() {
      this.showLoading();
      this.clockservice.getinoutstatus(this.userid).subscribe(
        result => {
          if (result.success) {
            // do something here
          } else {
            this.showError("API Error.");
          }
          this.loading.dismiss();
        },
        error => {
          this.showError("API Error.");
        }
      );
    }
    

    我面临的问题是,在ngOnInit事件中未收到用户id。控制台日志显示,即使在构造函数中接收到用户id之前,也会调用ngOnInit。

    控制台日志:

    inside
    
    1
    

    如何确保在构造函数中接收到所有get值之后调用is ngOnInit?

    1 回复  |  直到 8 年前
        1
  •  1
  •   cartant    8 年前

    最简单的解决方案是执行 Promise.all 等待检索两个存储值,然后调用 getStatus :

    ngOnInit() {
      Promise.all([
        this.storage.get('name'),
        this.storage.get('id')
      ])
      .then(([name, id]) => {
        this.username = name;
        this.userid = id;
        getStatus();
      })
      .catch(error => {
        this.showError("Storage Error.");
      });
    }
    

    在构造函数中检索存储值是可以的,但是-看看实现-看起来很可能 获取状态 以前不应该打电话 ngOnInit 因此,将存储调用和承诺链移动到 恩戈尼特