Ionic2 / Angular 2 平台导入

Question

我正在尝试使用 ionic 2 学习 ag2 并尝试最简单的事情。

我正在尝试在我的 ionic 2 应用中导入平台并获取必要的详细信息。

我关注了http://ionicframework.com/docs/v2/api/platform/Platform/

从 'ionic-angular' 导入 {Platform}；

@Component({...})
export MyPage {
  constructor(platform: Platform) {
    this.platform = platform;
  }
}

我的代码 -

    import {Component} from '@angular/core';
    import {Platform} from 'ionic-angular';

    @Component({
      templateUrl: 'build/pages/items-map/items-map.html'
    })
    export class ItemsMap {

      constructor(platform: Platform) {
          this.platform = platform;
     }

btainNetworkConnection() {
    this.platform.ready().then(() => {
        this.networkState = navigator.connection.type;

        var states = {};
        states[Connection.UNKNOWN]  = 'Unknown connection';
        states[Connection.ETHERNET] = 'Ethernet connection';
        states[Connection.WIFI]     = 'WiFi connection';
        states[Connection.CELL_2G]  = 'Cell 2G connection';
        states[Connection.CELL_3G]  = 'Cell 3G connection';
        states[Connection.CELL_4G]  = 'Cell 4G connection';
        states[Connection.CELL]     = 'Cell generic connection';
        states[Connection.NONE]     = 'No network connection';

        alert('Connection type: ' + states[this.networkState]);
    });
  }

    }

现在我正在尝试通过 gulp build 构建代码库并获得以下输出 -

[00:06:26] Using gulpfile ~/Documents/Projects/Ionic2_1/MyIonic2Project/gulpfile.js
[00:06:26] Starting 'clean'...
[00:06:26] Finished 'clean' after 14 ms
[00:06:26] Starting 'build'...
[00:06:26] Starting 'sass'...
[00:06:26] Starting 'html'...
[00:06:26] Starting 'fonts'...
[00:06:26] Starting 'scripts'...
[00:06:26] Finished 'html' after 45 ms
[00:06:26] Finished 'scripts' after 43 ms
[00:06:26] Finished 'fonts' after 48 ms
[00:06:26] Finished 'sass' after 637 ms
TypeScript error: /Users/kray/Documents/Projects/Ionic2_1/MyIonic2Project/app/pages/item-map/items-map.ts(10,12): Error TS2339: Property 'platform' does not exist on type 'ItemsMap'.
[00:06:28] Finished 'build' after 2.28 s

我感觉我在这里缺少一些我不确定的基本内容。

我还检查了 node_modules 中与平台相关的打字稿文件，它们存在。快照 -

Answer 1

您需要在您的项目映射中定义变量平台。

export class ItemsMap {

platform:Platform//my addition
  constructor(platform: Platform) {
      this.platform = platform;
 }

}

或者在构建构造函数快捷方式中使用打字稿来声明属性，如

export class ItemsMap {

    //notice modifier on constructor 
      constructor(public platform: Platform){

     }

    }

您可以在 Typescript 类here 上查看更多信息

Answer 2

使用 Typescript 时，构造函数中必须使用 private/public 词：

constructor(private platform: Platform) {
      //...
 }

另外，您不需要包含

this.platform = platform;

因为只需在您的构造函数中添加private platform : Platform，这个简短的语法就可以发挥很多作用：

• 声明构造函数参数及其类型
• 声明一个同名的私有属性
• 用 当我们“新建”一个类的实例时对应的参数