【问题标题】:Assigning an import to a variable within a constructor将导入分配给构造函数中的变量
【发布时间】:2017-03-04 20:13:48
【问题描述】:

我正在 Ionic2 中构建一个应用程序。我想在应用程序中实现 Facebook,所以我正在尝试使用 ionic-native Facebook api。我导入了它,然后尝试将它分配给一个变量,以便我可以使用与之关联的函数。

这是我的代码。

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { Facebook } from 'ionic-native';


@Component({
  selector: 'page-news-feed',
  templateUrl: 'news-feed.html',
})
export class NewsFeed {

  fb: any;

  constructor(public navCtrl: NavController, facebook: Facebook) {
    this.fb = facebook;
  }

    doRefresh(refresher) {
        console.log('Begin async operation', refresher);

        setTimeout(() => {
            console.log('Async operation has ended');
            refresher.complete();
        }, 2000);
    }

    this.fb.login([]);

  ionViewDidLoad() {
    console.log('Hello NewsFeed Page');
  }

}

我认为导入的工作方式很像一个类,因为您可以导入它并将其分配给一个变量,然后可以访问它的方法。它不是那样工作的吗?它是如何工作的?

【问题讨论】:

  • 看来您对fb.login() 的调用超出了任何函数定义。否则我看不出你的代码有什么问题。

标签: facebook typescript import ionic2


【解决方案1】:

您只需要像 Ionic 本机文档中所说的那样导入 Facebook 类: https://ionicframework.com/docs/v2/native/

你不需要通过构造函数注入它。由于方法是静态的,这将打印一个错误。

确保在platform.ready 事件之后也调用Facebook。并且不要忘记添加插件。请参阅相应修改的示例。

import { Component } from '@angular/core';
import { NavController, Platform } from 'ionic-angular';
import { Facebook } from 'ionic-native';


@Component({
  selector: 'page-news-feed',
  templateUrl: 'news-feed.html',
})
export class NewsFeed {

  constructor(public navCtrl: NavController, platform: Platform) {
    platform.ready().then(() => {
      console.log('Faceboook');
      Facebook.login([]).then((response) => {
        console.log(response);
      }).catch((error) => {
        console.error(error);
      });
    })
  }

    doRefresh(refresher) {
        console.log('Begin async operation', refresher);

        setTimeout(() => {
            console.log('Async operation has ended');
            refresher.complete();
        }, 2000);
    }

  ionViewDidLoad() {
    console.log('Hello NewsFeed Page');
  }

}

【讨论】: