Как передать параметр для фильтрации локальных данных JSON в угловых HTTP получить? - PullRequest
Новая
       39

Как передать параметр для фильтрации локальных данных JSON в угловых HTTP получить?

0 голосов
/ 28 февраля 2019

Я устанавливаю параметр для получения данных, но параметры не работают. Я получаю все значения в виде массивов.как фильтровать данные при получении.Вот как я устанавливаю параметр для моего файла service.ts 

   getinfojson(): Observable<IProduct[]> {

     let params = new HttpParams().set('projectname', "Sasi");

  this._http.get(this._producturl,{params : params}).subscribe( (res:Response)=>{
this.data = <IProduct[]> res.json();
console.log(this.data);
    })

Я получаю все значения из json в виде массива продуктов, как показано ниже: screebshot

enter image description here

но мне нужно получить подробности, основанные на имени менеджера проекта.Как я могу добиться этого.

И файл JSON моего продукта 

{
    "product": [
        {
        "projectname":"Sasi",
        "Managername":"Shiva"
        },
        {
            "projectname":"Sasikala",
            "Managername":"Dhivya"
            },
            {
                "projectname":"SasiDhivya",
                "Managername":"Visu"
                }
    ]
}

Ниже приводится мой импорт услуг ts 

import { Injectable } from '@angular/core';
  import { IProduct } from './product';
  import { Http , Response, RequestOptions} from '@angular/http';
import {HttpClientModule, HttpParams, HttpHeaders} from '@angular/common/http';
import {Observable,of, from } from 'rxjs';
import { HttpModule } from '@angular/http';



@Injectable({
  providedIn: 'root'

})
export class ApiserviceService {
  data:any;
  ifb:any;
  private _producturl='../../assets/product.json';
   constructor(private _http: Http){}

   getinfojson(): Observable<IProduct[]> {

     let params = new HttpParams().set('projectname', "Sasi");

  this._http.get(this._producturl,{params : params}).subscribe( (res:Response)=>{
this.data = <IProduct[]> res.json();
console.log(this.data);
    })
    return this.data;

     }
.

Ответы [ 2 ]

0 голосов
/ 28 февраля 2019

Предполагая, что вы хотите, чтобы имя проекта было входным, а IProduct - выходным, вот что вам нужно сделать. 

  this._http.get(this._producturl,{params : params})
    .pipe( 
       map( res => res.json() ),
       filter( res => res.product !== null ),
       map( res => {
          const matchingProduct = res.product.find( product => product. projectname === "Sasi");
          return matchingProduct;
       })
    )
    .subscribe( (matchingProduct)=>{
        this.data = matchingProduct;
        console.log(this.data);
    });

Я также не думаю, что вы используете rxjs правильно, когда выдля извлечения данных из потоков, просто сохраните весь поток в ApiserviceService классе 

this.data$ = this._http.get(this._producturl,{params : params})
  .pipe( 
    map( res => res.json() ),
    filter( res => res.product !== null ),
    map( res => {
     const matchingProduct = res.product.find( product => product. projectname === "Sasi");
     return matchingProduct;
    })
  );

Если вам нужно отрендерить data$, просто используйте канал async.Если вам нужен другой метод, сделайте из него обещание и дождитесь его. 

async methodThatNeedsProduct() {
   const product = await this.data$.pipe(take(1)).toPromise()
   // product is not available here
}
0 голосов
/ 28 февраля 2019

Класс HttpParams помогает добавлять параметры запроса в REST API, не фильтруя ответ, вместо этого вы можете использовать pipe и map для фильтрации данных, например: 

 this._http.get(this._producturl,{params : params}).pipe(map((response) => {
    response = response.filter((data) => data.projectname === "Sasi" );
    return response;
})).subscribe( (res:Response)=>{
    this.data = <IProduct[]> res.json();
    console.log(this.data);
})
...