クラス内のIonic2プライベートプロパティは、そのクラスに設定されていても常に空です

Question

Ionic2とTypeScriptで新しく、クラス、プロパティ、ゲッタ、セッタで試してみましょう。 私の最初のクラスはちょうど私が他のクラスで使用することを、webSQLデータベース内のいくつかの件のデータを初期化に関する情報を取得するメソッドを公開：

import { Injectable } from '@angular/core'; 
import * as PouchDB from 'pouchdb'; 

@Injectable() 
export class ezStockService { 
    private _db; 
    private _areas: any = []; 
    private _ezstockzs; 

    initDB(){ 
     this._db = new PouchDB('ezstockz', {adapter: 'websql'}); 

     var self = this; 

     /** 
     * Crée éventuellement les zones de stockage par défaut 
     **/ 
     this._db.get("area_1").catch(function(error){ 
      if(error.name === 'not_found'){ 
       return { 
        _id: "area_1", 
        libelle:[ 
         { 
          "lang": "FR-fr", 
          "value": "Nord" 
         }, 
         { 
          "lang": "EN-en", 
          "value": "North" 
         } 
        ], 
        "logo": "images/boussole.png" 
       } 
      } 
     }).then(function(gmDoc){ 
      self._db.put(gmDoc); 
     }); 

     this._db.get("area_2").catch(function(error){ 
      if(error.name === 'not_found'){ 
       return { 
        _id: "area_2", 
        libelle:[ 
         { 
          "lang": "FR-fr", 
          "value": "Sud" 
         }, 
         { 
          "lang": "EN-en", 
          "value": "South" 
         } 
        ], 
        "logo": "images/boussole.png" 
       } 
      } 
     }).then(function(fgDoc){ 
      self._db.put(fgDoc); 
     }); 

     this._db.get("area_3").catch(function(error){ 
      if(error.name === 'not_found'){ 
       return { 
        _id: "area_3", 
        libelle:[ 
         { 
          "lang": "FR-fr", 
          "value": "Est" 
         }, 
         { 
          "lang": "EN-en", 
          "value": "East" 
         } 
        ], 
        "logo": "images/boussole.png" 
       } 
      } 
     }).then(function(cgDoc){ 
      self._db.put(cgDoc); 
     }); 
    } 

    /** 
    * Method that retrieve all areas 
    **/ 
    allAreas() { 
     this._db = new PouchDB('ezstockz', {adapter: 'websql'}); 
     this._areas = []; 

     var self = this; 

     this._db.allDocs({ 
      startkey: 'area_', 
      endkey: 'area_\uffff', 
      include_docs: true 
     }).then(function(areas){ 
      var rows = areas.rows; 
      var zones = []; 
      rows.forEach((item,index) => { 
       var area = { 
        "libelle": item.doc.libelle[0].value, 
        "image": item.doc.logo 
       }; 
       zones.push(area); 
      }); 
      return zones; 
     }).then(function(areas){ 
      self._areas = areas; 
     }); 
    } 

    /** 
    * Method that get areas 
    **/ 
    get areas(){ 
     return this._areas; 
    } 
    } 

他の場所で私のアプリでは、私は、ビュー内のすべての分野をリストアップしたいと思いますので、別のクラスでは、領域を使用しようとするので、同じようゲッター：

import { Component } from '@angular/core'; 

import { NavController, Platform } from 'ionic-angular'; 

import { ezStockService } from '../../services/ez-stock.service'; 

@Component({ 
    selector: 'page-stocks', 
    templateUrl: 'stocks.html' 
}) 
export class Stocks { 
    public stocks = []; 
    items: any; 

    constructor(public navCtrl: NavController, 
    private platform: Platform, 
    private stockService: ezStockService) { 
    this.items = []; 

    var self = this; 

    stockService.allAreas(); // Invoke method 

    var areas = stockService.areas; // Invoke getter 


    console.log("Zones : (" + areas.length + ")"); 
    } 
} 

にconsole.logの結果はallAreas（）メソッドは、配列内の3つの項目を返す場合でも、常に「0」です...

この動作が理解できない理由はわかりません活字体のプロパティスコープ...

Thxを4あなたの助け...

Answer 1

ライン

stockService.allAreas(); // Invoke method 

で次のことを行う必要があり

stockService.allAreas().then(function(){ 
    var areas = stockService.areas; // Invoke getter 
    console.log("Zones : (" + areas.length + ")");  
}); // Invoke method 

このことは非同期呼び出しだからです。それが完了したときに解決しなければならない約束です。