TypeError: Object(...) is not a function

TypeError: Object(...) is not a function

正在处理 ionic3、angularfire2 v5

TypeError: Object(...) is not a function
    at SwitchMapSubscriber.project (http://localhost:8100/build/vendor.js:73935:76)
    at SwitchMapSubscriber._next (http://localhost:8100/build/vendor.js:61778:27)
    at SwitchMapSubscriber.Subscriber.next (http://localhost:8100/build/vendor.js:20750:18)
    at RefCountSubscriber.Subscriber._next (http://localhost:8100/build/vendor.js:20786:26)
    at RefCountSubscriber.Subscriber.next (http://localhost:8100/build/vendor.js:20750:18)
    at Subject.next (http://localhost:8100/build/vendor.js:23237:25)
    at ConnectableSubscriber.Subscriber._next (http://localhost:8100/build/vendor.js:20786:26)
    at ConnectableSubscriber.Subscriber.next (http://localhost:8100/build/vendor.js:20750:18)
    at Notification.observe (http://localhost:8100/build/vendor.js:51866:50)
    at AsyncAction.DelaySubscriber.dispatch (http://localhost:8100/build/vendor.js:76246:40)

home.ts

import { Component } from '@angular/core';
import {IonicPage, NavController} from 'ionic-angular';
import { Observable } from "rxjs/Observable";
import { Item } from "../../models/item/item.model";
import {ShoppingListServices} from "../../services/shopping-list/shopping-list.services";



@IonicPage()

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
  shoppingList$: Observable<Item[]>;
  constructor(public navCtrl: NavController,  private shopping: ShoppingListServices) {
    this.shoppingList$=this.shopping
      .getShoppingList()
      .snapshotChanges()
      .map(
        changes => {
          return changes.map(c => ({
            key: c.payload.key, ...c.payload.val()
          }));
        }
      );
  }

}

home.html

<ion-header>
  <ion-navbar color="primary">
    <ion-title>
      Shoping List
    </ion-title>
    <ion-buttons end>
      <button navPush="AddShoppingItemPage" ion-button>
        <ion-icon name="add"></ion-icon>
      </button>
    </ion-buttons>
  </ion-navbar>
</ion-header>

<ion-content padding>
  <ion-list>
    <ion-list-header>
      Items
    </ion-list-header>
    <ion-item *ngFor="let item of shoppingList$ | async">
      {{ item.name }}
    </ion-item>
  </ion-list>
</ion-content>

我从 :

"angularfire2" : "5.0.0-rc.8.0" and   "firebase": "^5.0.2",

至:

"angularfire2" : "5.0.0-rc.6.0" and "firebase": "4.12.1"

在 CLI 中的命令行下 me:Run 有效的方法

npm install angularfire2@5.0.0-rc.6 firebase@4.13.1

npm install @firebase/app@^0.1.6

AngularFire 的最新版本需要 rxjs 6。请升级 rxjs,如果您有尚未升级的依赖项,则需要包含 rxjs-compat

即使您可以 运行 rxjs-compat,您需要更改代码以反映新的 RXJS 只是时间问题。如果您使用 Angular 6 和 Angular 6 CLI,那么您将拥有 RXJS 6,因为 Angular 大多数事情都依赖于 RXJS。此外,如果您计划使用 Angular Material 2,那么您将需要 Angular 6。所以让我们更新您的 RXJS。这对于 Ionic 4 来说非常重要。Ionic 4 将高度依赖 angular,因为它现在将包含 Angular 路由。

RXJS 6 的一些最常见的变化是:

import 'rxjs/add/observable/of';
// or 
import { of } from 'rxjs/observable/of';

变成

import { of } from 'rxjs';

import 'rxjs/add/operator/map';
import 'rxjs/add/operator/take';

变成

从 'rxjs/operators';

导入 { 地图,取 }

import { Observable } from 'rxjs/Observable';
import { Subject } from 'rxjs/Subject';

变成

import { Observable, Subject } from 'rxjs';

https://www.academind.com/learn/javascript/rxjs-6-what-changed/

这对我有用,使用 "angularfire2": "^5.0.0-rc.11"

npm i rxjs@6 rxjs-compat@6 promise-polyfill --save

检索数据:

this.db.list('/customers').valueChanges().subscribe((datas) => { 
  console.log("datas", datas)
},(err)=>{
   console.log("probleme : ", err)
});

或者您可以查看 GitHub angularfire2 的存储库 here 了解更多详细信息

我有解决办法:

您可以简单地卸载两个包,即 angularfire2 和 firebase

typeError: Object(...) is not a function ionic

您需要安装这个:运行 CLI 中的命令行下方

npm i rxjs@6 rxjs-compat@6 promise-polyfill --save

然后将这些库导入到您的 home.ts:

import { Observable } from 'rxjs';
import 'rxjs/add/operator/map';

虽然我的问题与 angularfire 无关,但正在搜索 TypeError: Object(…) is not a function 将用户带到这个问题。 我的问题是我在 ionic v3 中使用 Youtube Video Player 插件。但是由于 ionic v3 文档现在自动重定向到 ionic v4 文档,我使用的是最新版本的插件。

只需安装 Youtube Video Player 插件的第 4 版即可。

npm install --save @ionic-native/youtube-video-player@4

Ionic v3 docs

P.S:当您自动重定向到 ionic 的 v4 文档时,只需在 URL.

中插入 v3

如果您在 ionic 3 中安装任何新插件后得到

然后检查package.json文件

中statusbar或splashscreen插件的版本
  "@ionic-native/splash-screen": "~4.17.0",
  "@ionic-native/status-bar": "~4.17.0",

并将安装的插件版本更改为相同的版本并执行

npm update

看起来像这样

    "@ionic-native/camera": "^4.17.0",
    "@ionic-native/core": "~4.17.0",
    "@ionic-native/splash-screen": "~4.17.0",
    "@ionic-native/status-bar": "~4.17.0",

希望它能帮助某人......为我工作android许可和相机插件

此外,您需要从导入语句中删除 ngx

import { Camera, CameraOptions } from '@ionic-native/camera';

这件事发生在我身上, 也许你在你的项目中使用 ionic 3 ,并且你安装了 ionic 版本 4 的插件, 如果您使用的是 ionic 3,请尝试从 https://ionicframework.com/docs/v3/.

安装您的插件

我正在使用 rxjs-etc 库,但由于某种原因我遇到了冲突,这不仅导致了错误 TypeError: Object(…) is not a function,而且绝对杀死了我在 [=16= 中的 CPU ].

我不太清楚为什么 - 据我所知,这与最近的 rxjs 版本不兼容有关 - 但如果你正在使用这个库,它可能是造成这种情况的原因。