时间戳

首页 > 解决方案 > 在进行 http 调用时将搜索过滤器添加到 observable

angular - 在进行 http 调用时将搜索过滤器添加到 observable

问题描述

我的json如下：

[
  {
    "name": "one",
    "address": "1 Street"
  },
  {
    "name": "two",
    "address": "2 Street"
  },
  {
    "name": "three",
    "address": "3 Street"
  },
  {
    "name": "four",
    "address": "4 Street"
  },
  {
    "name": "five",
    "address": "5 Street"
  }

 ]

如何按上面name传递给 getCompanies 的变量进行过滤name？

  public getCompanies(name): Observable<any> {
    return Observable.create((observer: Observer) => {
      this.http.get(this.companyApiUrl)
        .subscribe(data => {
            observer.next(data)
            observer.complete()
        }, err => observer.error(err))
    })
  }

标签： angular

解决方案

无需将 包装在http.get中Observable，因为它已经返回了Observable。相反，您可以使用map运算符来转换响应，并使用数组filter函数来查找name属性与传入的项匹配的项。

请注意下面的代码使用 rxjs 6 

 import { map } from 'rxjs/operators';

 public getCompanies(searchTerm): Observable<any> {
     return this.http.get(this.companyApiUrl).pipe(
         map((arr) => arr.filter(item => !searchTerm || item.name && item.name.indexOf(searchTerm) !== -1))
     )      
  }

推荐阅读