Question

尝试编译时，我收到错误

property 'filter' does not exist on type 'observable<any>'

搜索了一下后，我找到了插入

的建议

import 'rxjs/add/operator/filter'

在此之后，我得到了同样的错误，但是对于排序

property 'sort' does not exist on type 'observable<any>'

所以，我删除了排序，然后我收到以下错误：

Type 'Observable<any> is not assignable to type 'any[]'. Property 'includes' is missing in type 'Observable<any>.

从json文件导入信息

部分代码：

import { Component, OnInit, Injectable } from '@angular/core';
import { UserinfoService } from '../services/userinfo.service';
import { Member } from '../class/member';
import { MatDialog } from '@angular/material';
import { MemberdialogComponent } from '../memberdialog/memberdialog.component';
import 'rxjs/add/operator/filter';

@Component({
    selector: 'app-teammembers',
    templateUrl: './teammembers.component.html',
    styleUrls: ['./teammembers.component.css']
})

export class TeammembersComponent implements OnInit
{

//props
teamMembers: any[];
searchQuery: any = "";
searchResults: any[] = this.teamMembers;
teams: any[];
selectedTeam: any;

//constructor
constructor(private userinfoService: UserinfoService, public dialog: MatDialog)
{
    //getData
  this.teamMembers = userinfoService.getMembers()
    .filter(member => member.isActive)
    .sort((a, b) => a.lastName.localeCompare(b.lastName));

    //put all information in results
    this.searchResults = this.teamMembers;

    //getTeams
    this.teams = this.teamMembers
        .map(item => item.team)
        .filter((value, index, self) => self.indexOf(value) === index)
}

userinfoservice的代码：

import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/map';

import { Member } from '../class/member';

@Injectable()
export class UserinfoService
{

    //constructor
    constructor(private http: Http)
    {

    }

    //methods or services

    getMembers()
    {
        return this.http.get('http://fakelocation/JsonData/api/teammembers').map(response => response.json())
    }

Answer 1

根据RxJS 6.0最新标准https://github.com/ReactiveX/rxjs/blob/master/docs_app/content/guide/v6/migration.md，可以通过将一个运算符的结果传递给另一个运算符来解决此问题。

this.teamMembers = userinfoService.getMembers()
    .pipe( .filter(member => member.isActive)
    .sort((a, b) => a.lastName.localeCompare(b.lastName)));

财产＆＃39;过滤＆＃39;在类型＆＃39; observable <any>＆＃39;上不存在

1 个答案: