TypeError: Object(...) 不是函数

Posted 2023-02-19

【中文标题】TypeError: Object(...) 不是函数

【英文标题】：TypeError: Object(...) is not a function

【发布时间】：2018-10-25 04:41:27

【问题描述】：

在 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>

【问题讨论】：

嘿，同样的问题。我发现错误来自在您的应用程序中使用 Firestore。我知道这不是问题的答案，但可能有助于进一步调查。

是的，我正在投资。如果我找到任何解决方案，我会在这里发布。你也这样做

成功了吗？我现在也有同样的情况。

"ERROR TypeError: Object(...) is not a function" using AngularFirestore and firebase的可能重复

【参考方案1】：

我从：

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

到：

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

【讨论】：

让我们看看，我会降级

与 6.0 相同的问题。

【参考方案2】：

什么对我有用：在 CLI 的命令行下运行

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

和

npm install @firebase/app@^0.1.6

【参考方案3】：

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

【讨论】：

Angularfire2 版本 5.0.0rc 4 解决了我的问题。但是当 rc8 或 9 和 rxj（更改 rxjs_compat）。其他错误即将到来，地图错误***.com/questions/50387987/…

【参考方案4】：

尽管您可以运行 rxjs-compat，但您需要更改代码以反映新的 RXJS 只是时间问题。如果您使用 Angular 6 和 Angular 6 CLI，那么您将拥有 RXJS 6，因为 Angular 在大多数事情上都依赖于 RXJS。此外，如果您打算使用 Angular Material 2，那么您将需要 Angular 6。所以让我们更新您的 RXJS。从 Ionic 4 开始，这将非常重要。Ionic 4 将高度依赖 Angular，因为它现在将包含 Angular Routes。

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';

变成

import map, take from '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/

【讨论】：

值得一提的是运营商的新 pipe() 用法。您提供的链接确实解释了这一点，但我认为您的回答也值得提及。

【参考方案5】：

这对我有用，使用"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 了解更多详情

【讨论】：

先生，我遇到了同样的错误，我没有使用 angularFire，所以可以安装这个插件吗？

啊！为我工作，我只是缺少“promise-polyfill”，非常感谢！

【参考方案6】：

我有一个解决方案：

只需卸载两个包，即 angularfire2 和 firebase

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

【参考方案7】：

你需要安装这个：在 CLI 的命令行下面运行

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

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

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

【讨论】：

这个建议也适用于我。除此之外，我还将 angularfire2 从 5.1.3 降级到 5.0.0-rc.11

【参考方案8】：

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

只需安装第 4 版的 Youtube Video Player 插件，一切顺利。

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

Ionic v3 docs

P.S：当您被自动重定向到 ionic 的 v4 文档时，只需在 URL 中插入 v3。

【参考方案9】：

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

然后只需检查 package.json 文件中状态栏或闪屏插件的版本

  "@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 权限和相机插件

另外，您需要从 import 语句中删除 ngx

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

【参考方案10】：

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

【参考方案11】：

我正在使用 rxjs-etc 库，但由于某种原因发生了冲突，这不仅导致了错误 TypeError: Object(…) is not a function，而且还完全杀死了我在 Chrome 中的 CPU。

我不确定为什么——据我所知，这与最近的 rxjs 版本不兼容有关——但如果你使用这个库，它可能是造成这种情况的原因。