我想开发一个带有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;
这是我的家。
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;
谢谢:)
答案 0 :(得分:1)
我怀疑你安装了错误版本的firebase。您需要继续使用版本2.4.2的firebase,因为AngularFire2尚未更新以支持最新版本的firebase。
此处提供更多信息:https://github.com/aaronksaunders/ionic2-angularfire-sample
查看package.json