angularfire 2 TypeError:Firebase不是构造函数

时间:2016-05-26 12:11:33

标签: angular firebase angularfire ionic2

我想开发一个带有ionic 2和angularfire 2的示例应用程序。

我在Ionic 2中成功集成了angularfire 2,但是当我尝试从firebase获取数据时,我在浏览器控制台中遇到了这个错误:

`XCEPTION: Error: Uncaught (in promise): EXCEPTION: Error in :0:0
ORIGINAL EXCEPTION: TypeError: Firebase is not a constructor
ORIGINAL STACKTRACE:
TypeError: Firebase is not a constructor
    at exports.COMMON_PROVIDERS.core_1.provide.useFactory (http://localhost:8100/build/js/app.bundle.js:38023:45)
    at DebugAppView.Object.defineProperty.get (MyApp_Host.template.js:28:81)
    at DebugAppView.Object.defineProperty.get (MyApp_Host.template.js:34:98)
    at DebugAppView.Object.defineProperty.get (MyApp_Host.template.js:40:97)
    at DebugAppView.Object.defineProperty.get (MyApp_Host.template.js:52:124)
    at DebugAppView._View_MyApp_Host0.injectorGetInternal (MyApp_Host.template.js:74:80)
    at DebugAppView.AppView.injectorGet (http://localhost:8100/build/js/app.bundle.js:25671:21)
    at DebugAppView.injectorGet (http://localhost:8100/build/js/app.bundle.js:25844:49)
    at ElementInjector.get (http://localhost:8100/build/js/app.bundle.js:25299:33)
    at ElementInjector.get (http://localhost:8100/build/js/app.bundle.js:25302:48)
ERROR CONTEXT:
[object Object]
app.bundle.js:33661 EXCEPTION: Error: Uncaught (in promise): EXCEPTION: Error in :0:0
ORIGINAL EXCEPTION: TypeError: Firebase is not a constructor
ORIGINAL STACKTRACE:
TypeError: Firebase is not a constructor
    at exports.COMMON_PROVIDERS.core_1.provide.useFactory (http://localhost:8100/build/js/app.bundle.js:38023:45)
    at DebugAppView.Object.defineProperty.get (MyApp_Host.template.js:28:81)
    at DebugAppView.Object.defineProperty.get (MyApp_Host.template.js:34:98)
    at DebugAppView.Object.defineProperty.get (MyApp_Host.template.js:40:97)
    at DebugAppView.Object.defineProperty.get (MyApp_Host.template.js:52:124)
    at DebugAppView._View_MyApp_Host0.injectorGetInternal (MyApp_Host.template.js:74:80)
    at DebugAppView.AppView.injectorGet (http://localhost:8100/build/js/app.bundle.js:25671:21)
    at DebugAppView.injectorGet (http://localhost:8100/build/js/app.bundle.js:25844:49)
    at ElementInjector.get (http://localhost:8100/build/js/app.bundle.js:25299:33)
    at ElementInjector.get (http://localhost:8100/build/js/app.bundle.js:25302:48)
ERROR CONTEXT:
[object Object]BrowserDomAdapter.logError @ app.bundle.js:33661
app.bundle.js:33661 STACKTRACE:BrowserDomAdapter.logError @ app.bundle.js:33661
app.bundle.js:33661 Error: Uncaught (in promise): EXCEPTION: Error in :0:0
ORIGINAL EXCEPTION: TypeError: Firebase is not a constructor
ORIGINAL STACKTRACE:
TypeError: Firebase is not a constructor
    at exports.COMMON_PROVIDERS.core_1.provide.useFactory (http://localhost:8100/build/js/app.bundle.js:38023:45)
    at DebugAppView.Object.defineProperty.get (MyApp_Host.template.js:28:81)
    at DebugAppView.Object.defineProperty.get (MyApp_Host.template.js:34:98)
    at DebugAppView.Object.defineProperty.get (MyApp_Host.template.js:40:97)
    at DebugAppView.Object.defineProperty.get (MyApp_Host.template.js:52:124)
    at DebugAppView._View_MyApp_Host0.injectorGetInternal (MyApp_Host.template.js:74:80)
    at DebugAppView.AppView.injectorGet (http://localhost:8100/build/js/app.bundle.js:25671:21)
    at DebugAppView.injectorGet (http://localhost:8100/build/js/app.bundle.js:25844:49)
    at ElementInjector.get (http://localhost:8100/build/js/app.bundle.js:25299:33)
    at ElementInjector.get (http://localhost:8100/build/js/app.bundle.js:25302:48)
ERROR CONTEXT:
[object Object]
    at resolvePromise (http://localhost:8100/build/js/zone.js:538:32)
    at resolvePromise (http://localhost:8100/build/js/zone.js:523:18)
    at http://localhost:8100/build/js/zone.js:571:18
    at ZoneDelegate.invokeTask (http://localhost:8100/build/js/zone.js:356:38)
    at Object.NgZoneImpl.inner.inner.fork.onInvokeTask (http://localhost:8100/build/js/app.bundle.js:30460:41)
    at ZoneDelegate.invokeTask (http://localhost:8100/build/js/zone.js:355:43)
    at Zone.runTask (http://localhost:8100/build/js/zone.js:256:48)
    at drainMicroTaskQueue (http://localhost:8100/build/js/zone.js:474:36)
    at XMLHttpRequest.ZoneTask.invoke (http://localhost:8100/build/js/zone.js:426:22)BrowserDomAdapter.logError @ app.bundle.js:33661
zone.js:461 Unhandled Promise rejection: EXCEPTION: Error in :0:0
ORIGINAL EXCEPTION: TypeError: Firebase is not a constructor
ORIGINAL STACKTRACE:
TypeError: Firebase is not a constructor
    at exports.COMMON_PROVIDERS.core_1.provide.useFactory (http://localhost:8100/build/js/app.bundle.js:38023:45)
    at DebugAppView.Object.defineProperty.get (MyApp_Host.template.js:28:81)
    at DebugAppView.Object.defineProperty.get (MyApp_Host.template.js:34:98)
    at DebugAppView.Object.defineProperty.get (MyApp_Host.template.js:40:97)
    at DebugAppView.Object.defineProperty.get (MyApp_Host.template.js:52:124)
    at DebugAppView._View_MyApp_Host0.injectorGetInternal (MyApp_Host.template.js:74:80)
    at DebugAppView.AppView.injectorGet (http://localhost:8100/build/js/app.bundle.js:25671:21)
    at DebugAppView.injectorGet (http://localhost:8100/build/js/app.bundle.js:25844:49)
    at ElementInjector.get (http://localhost:8100/build/js/app.bundle.js:25299:33)
    at ElementInjector.get (http://localhost:8100/build/js/app.bundle.js:25302:48)
ERROR CONTEXT:
[object Object] ; Zone: angular ; Task: Promise.then ; Value: ViewWrappedExceptionconsoleError @ zone.js:461
zone.js:463 Error: Uncaught (in promise): EXCEPTION: Error in :0:0(…)consoleError @ zone.js:463
app.bundle.js:74808 Native: tried calling StatusBar.styleDefault, but Cordova is not available. Make sure to include cordova.js or run in a device/simulator`

这是我的app.ts



import {App, Platform} from 'ionic-angular';
import {StatusBar} from 'ionic-native';
import {HomePage} from './pages/home/home';
import { FIREBASE_PROVIDERS, defaultFirebase} from 'angularfire2';


@App({
  template: '<ion-nav [root]="rootPage"></ion-nav>',
  providers: [
    FIREBASE_PROVIDERS,
    defaultFirebase('https://samplequizapp-50eb5.firebaseio.com')
  ],
  config: {} // http://ionicframework.com/docs/v2/api/config/Config/
})
export class MyApp {
  rootPage: any = HomePage;

  constructor(platform: Platform) {
    platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      StatusBar.styleDefault();
    });
  }
}
&#13;
&#13;
&#13;

这是我的家。

&#13;
&#13;
import {Page} from 'ionic-angular';
import { AngularFire, FirebaseListObservable } from 'angularfire2';

@Page({
  templateUrl: 'build/pages/home/home.html'
})
export class HomePage {
  myData: FirebaseListObservable<any[]>;

  constructor(public af: AngularFire) {
    this.myData = af.database.list('/userId')
    console.log(this.myData)
  }

};
&#13;
&#13;
&#13;

谢谢:)

1 个答案:

答案 0 :(得分:1)

我怀疑你安装了错误版本的firebase。您需要继续使用版本2.4.2的firebase,因为AngularFire2尚未更新以支持最新版本的firebase。

此处提供更多信息:https://github.com/aaronksaunders/ionic2-angularfire-sample

查看package.json