RXJS最近有突破性的变化吗？

我在Angular 6中有以下代码，以前工作得很好

 getNavigation(db): any {
    return db.list('/pages', ref => {
        let query = ref.limitToLast(100).orderByChild('sortOrder');
        return query;
    }).snapshotChanges().map(changes => {
        return changes.map(change => ({key: change.payload.key, ...change.payload.val()}));
    });
}

---

突然，在最近的一些库更新（rxjs？？）中，它抛出了一个错误？什么语法发生了变化，突然破坏了我的代码

错误类型错误：db.list（…）。快照更改（…）。映射不是 功能 在NavigationComponent.push../src/app/navigation.component.ts.NavigationComponent.getNavigation

或者更重要的是，我如何修复它-（

管道贴图操作符：

getNavigation(db): any {
    return db.list('/pages', ref => {
        let query = ref.limitToLast(100).orderByChild('sortOrder');
        return query;
    }).snapshotChanges().pipe(
map(changes => {
        return changes.map(change => ({key: change.payload.key, ...change.payload.val()}));
    }));
}

还要确保以正确的方式导入

map

：

import {map} from 'rxjs/operators';

管道贴图操作符：

getNavigation(db): any {
    return db.list('/pages', ref => {
        let query = ref.limitToLast(100).orderByChild('sortOrder');
        return query;
    }).snapshotChanges().pipe(
map(changes => {
        return changes.map(change => ({key: change.payload.key, ...change.payload.val()}));
    }));
}

还要确保以正确的方式导入

map

：

import {map} from 'rxjs/operators';

---

好了，终于弄明白了

以下是任何遇到类似问题的人的工作代码：

import { Component } from '@angular/core';
import { Observable}  from 'rxjs';
import { AngularFireDatabase, AngularFireList } from 'angularfire2/database';
import { map } from 'rxjs/operators';
import { LogoComponent } from './logo.component';

@Component({
    selector: 'app-navigation',
    templateUrl: './navigation.component.html'
})


export class NavigationComponent {
    items: Observable<any[]>;
    childItems: Observable<any[]>;

    constructor(db: AngularFireDatabase) {
        this.items = this.getNavigation(db);
        this.childItems = this.getNavigation(db);
    }

    getNavigation(db: AngularFireDatabase): any {
        return db.list('/pages', ref => {
            let query = ref.limitToLast(100).orderByChild('sortOrder');
            return query;
        }).snapshotChanges().pipe(
            map(pages => {
                return pages.map(p => ({ key: p.key, ...p.payload.val() }));
            })
        );
    }
}

从'@angular/core'导入{Component}；
从“rxjs”导入{Observable}；
从“angularfire2/database”导入{AngularFireDatabase，AngularFireList}；
从“rxjs/operators”导入{map}；
从“./logo.component”导入{logomponent}；
@组成部分({
选择器：“应用程序导航”，
templateUrl:“./navigation.component.html”
})
导出类导航组件{
项目：可观察；
子项：可观察；
构造函数（db:AngularFireDatabase）{
this.items=this.getNavigation（db）；
this.childItems=this.getNavigation（db）；
}
getNavigation（db:AngularFireDatabase）：任意{
返回db.list（'/pages'，ref=>{
让query=ref.limitToLast（100）.orderByChild（'sortOrder'）；
返回查询；
}).snapshotChanges（）.pipe(
地图（页面=>{
返回pages.map（p=>（{key:p.key，…p.payload.val（）}））；
})
);
}
}

为了克服typescript错误，我必须键入

getNavigation

的

db

参数

---

然后我不得不删除这个问题的反馈和AngularFire的迁移文档中显示的不必要的subscribe函数。虽然在某些用例中这可能是必要的，但在我的用例中却不是。

好的，最终解决了这个问题

以下是任何遇到类似问题的人的工作代码：

import { Component } from '@angular/core';
import { Observable}  from 'rxjs';
import { AngularFireDatabase, AngularFireList } from 'angularfire2/database';
import { map } from 'rxjs/operators';
import { LogoComponent } from './logo.component';

@Component({
    selector: 'app-navigation',
    templateUrl: './navigation.component.html'
})


export class NavigationComponent {
    items: Observable<any[]>;
    childItems: Observable<any[]>;

    constructor(db: AngularFireDatabase) {
        this.items = this.getNavigation(db);
        this.childItems = this.getNavigation(db);
    }

    getNavigation(db: AngularFireDatabase): any {
        return db.list('/pages', ref => {
            let query = ref.limitToLast(100).orderByChild('sortOrder');
            return query;
        }).snapshotChanges().pipe(
            map(pages => {
                return pages.map(p => ({ key: p.key, ...p.payload.val() }));
            })
        );
    }
}

从'@angular/core'导入{Component}；
从“rxjs”导入{Observable}；
从“angularfire2/database”导入{AngularFireDatabase，AngularFireList}；
从“rxjs/operators”导入{map}；
从“./logo.component”导入{logomponent}；
@组成部分({
选择器：“应用程序导航”，
templateUrl:“./navigation.component.html”
})
导出类导航组件{
项目：可观察；
子项：可观察；
构造函数（db:AngularFireDatabase）{
this.items=this.getNavigation（db）；
this.childItems=this.getNavigation（db）；
}
getNavigation（db:AngularFireDatabase）：任意{
返回db.list（'/pages'，ref=>{
让query=ref.limitToLast（100）.orderByChild（'sortOrder'）；
返回查询；
}).snapshotChanges（）.pipe(
地图（页面=>{
返回pages.map（p=>（{key:p.key，…p.payload.val（）}））；
})
);
}
}

为了克服typescript错误，我必须键入

getNavigation

的

db

参数

---

---

然后我不得不删除这个问题的反馈和AngularFire的迁移文档中显示的不必要的订阅功能。虽然这在某些用例中可能是必要的，但它不在我的用例中。

你得到了什么错误？@DiabolicWords更新了错误。“最近的一些库更新”您更改了什么？更新了哪些库？您以前使用的是什么版本，现在使用的是什么版本？我使用的是Angular 6.0.0和rxjs 6.1.0，并升级到Angular 6.0.3和rxjs 6.2.0。出现了什么错误？@DiabolicWords更新了错误。“最近更新了一些库”您更改了什么？更新了哪些库？您以前使用的是什么版本，现在使用的是什么版本？我使用的是Angular 6.0.0和rxjs 6.1.0，并升级到Angular 6.0.3和rxjs 6.2.0。属性“map”在类型“{}”上不存在，即使导入也不存在。注意这在

return changes.map上（change=>

lineimport{map}来自'rxjs/operators'；更改不是可观察的，为什么要尝试映射它？如果'changes'的类型是数组，则只能使用map（Array.prototype.map），否则应该删除该映射。here:here:hi希望这有帮助。属性'map'不存在于类型'{}'即使使用导入。请注意，这在

返回changes.map（change=>

lineimport{map}上，来自'rxjs/operators'；更改是不可观察的，为什么要尝试映射它？如果'changes'的类型是一个数组，那么您可以使用该映射（Array.prototype.map），否则您应该删除该映射。here:here:hi:hi希望这有帮助。