TypeError: Object (...) не является функцией
работа на ionic3, angularfire2 v5
TypeError: Object(...) не является функцией в SwitchMapSubscriber.проект (http://localhost:8100/build/vendor.js: 73935: 76) в SwitchMapSubscriber._next (http://localhost:8100/build/vendor.js: 61778: 27) в SwitchMapSubscriber.Абонент.далее (http://localhost:8100/build/vendor.js: 20750: 18) на RefCountSubscriber.Абонент._следующий (http://localhost:8100/build/vendor.js: 20786: 26) на RefCountSubscriber.Абонент.далее (http://localhost:8100/build/vendor.js: 20750: 18) на тему.далее (http://localhost:8100/build/vendor.js: 23237: 25) в ConnectableSubscriber.Абонент._next (http://localhost:8100/build/vendor.js: 20786: 26) в ConnectableSubscriber.Абонент.далее (http://localhost:8100/build/vendor.js: 20750: 18) при уведомлении.наблюдайте (http://localhost:8100/build/vendor.js: 51866: 50) в AsyncAction.DelaySubscriber.депеша (http://localhost:8100/build/vendor.js: 76246: 40)
дома.ТС
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()
}));
}
);
}
}
дома.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>
6 ответов
это работает для меня, используя "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 здесь для более подробной информации
последние выпуски AngularFire требуют rxjs 6. Пожалуйста, обновите rxjs, вам нужно будет включить rxjs-compat
Если у вас есть зависимости, которые еще не обновлены.
даже если вы можете запустить rxjs-compat, это только вопрос времени, прежде чем вам нужно будет изменить свой код, чтобы отразить новый RXJS. Если вы используете Angular 6 и Angular 6 CLI, то у вас будет RXJS 6, так как Angular зависит от RXJS для большинства вещей. Также если вы планируете использовать угловой материал 2, то вам понадобится угловой 6. Поэтому давайте просто обновим RXJS. Это будет действительно важно с Ionic 4. Ionic 4 будет сильно зависеть от углового, поскольку теперь он будет включать угловые маршруты.
некоторые из наиболее распространенных изменений 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/
я изменилась с :
"angularfire2" : "5.0.0-rc.8.0" and "firebase": "^5.0.2",
в :
"angularfire2" : "5.0.0-rc.6.0" and "firebase": "4.12.1"
Что сработало для меня:
установка npm angularfire2@5.0.0-rc - ... 6 firebase@4.13.1
и
npm install @firebase / app@^0.1.6