使用 "firebase" 和 AngularFire2 v4

Question

我的 Angular 网络应用程序使用 angularfire2，我最近升级到 v4.0.0-rc0。它在几个方面表现不同。我需要帮助的是在 v4.0.0 版本中使用 'firebase'（常规 Firebase JS 库）和 angularfire2。在以前的版本中，您将导入：

import * as firebase from 'firebase';

然后使用带有如下语句的常规 Firebase JS 库：

firebase.database().ref().child("message").set("hi");

这在以前的版本中运行良好，请观看此视频以了解有关该方法的更多信息（这是使用存储时的要求）： https://www.youtube.com/watch?v=nMR_JPfL4qg#t=6m11s

然而，当我尝试用 v4.0.0-rc0 做同样的事情时，我收到了这个错误信息：

Firebase: No Firebase App '[DEFAULT]' has been created - call Firebase App.initializeApp() (app/no-app).

我可以阅读消息并意识到它认为尚未调用 initializeApp。但是如果我像这样使用 angularfire2 v4 代码...

this.afDatabase.object("somepath").subscribe( (myData: any) => {
      console.log("My data", data); 
     });

没关系，因为我在 app.module.ts 中使用了 initializeApp。所以真正的问题是之前的行：

AngularFireModule.initializeApp(environment.firebaseConfig),

适用于 angularfire2 和常规 Firebase JS 库，但现在无效。现在为数据库使用常规 Firebase JS 库的正确方法是什么？我也可以在 app.module.ts 中调用 firebase.initializeApp 吗？当然，进行 2 次 initializeApp 调用似乎很糟糕，但我不知道正确的方法。

Answer 1

解决了我的问题，我在初始化应用程序时不需要在 app.module.ts 中提供自定义名称。这很好用：

AngularFireModule.initializeApp(environment.firebaseConfig),

这很糟糕：

AngularFireModule.initializeApp(environment.firebaseConfig, 'myApp'),

Answer 2

你必须导入新的实现模块并放入 import * as firebase from 'firebase/app'; 在您要使用提供商的组件中var provider = new firebase.auth.GoogleAuthProvider();

      import { AngularFireModule } from 'angularfire2';
      import { AngularFireDatabaseModule } from 'angularfire2/database';
      import { AngularFireAuthModule } from 'angularfire2/auth';

      export const environment = {
        production: false,
        firebase: {
          apiKey: "dfgdfgdsfgdfgsdfg",
          authDomain: "fire-dfgdfg.sdfgdfg.com",
          databaseURL: "https://fire-dsfgdfg.dfgdfgdf.com",
          projectId: "fire-dfgdfg",
          storageBucket: "fire-dfgdfg.appspot.com",
          messagingSenderId: "65456456464654"
        }
      }

      @NgModule({
        imports: [
          BrowserModule,
          BrowserAnimationsModule,
          AppRoutingModule,
          BsDropdownModule.forRoot(),
          TabsModule.forRoot(),
          ChartsModule,
          AngularFireModule.initializeApp(environment.firebase),
          AngularFireDatabaseModule,
          AngularFireAuthModule
        ],
        declarations: [
          AppComponent,
          FullLayoutComponent,
          SimpleLayoutComponent,
          ChatLayoutComponent,
          NAV_DROPDOWN_DIRECTIVES,
          BreadcrumbsComponent,
          SIDEBAR_TOGGLE_DIRECTIVES,
          AsideToggleDirective
        ],
        providers: [{
          provide: LocationStrategy,
          useClass: HashLocationStrategy
        }],
        bootstrap: [AppComponent]
      })

使用 "firebase" 和 AngularFire2 v4

Using "firebase" with AngularFire2 v4

firebase

angularfire2