Фильтр угловой JSON 7 - PullRequest
       1

Фильтр угловой JSON 7

0 голосов
/ 28 ноября 2018

Я начинаю угловое приложение 7, начинающий угловой.Я звоню из API (например) и сохраняю результат в локальном хранилище.Все идет нормально.После сохранения мне нужно сделать фильтр в поле с именем pdv.

Я не могу реализовать фильтр таким, какой он есть, он говорит, что фильтр не является частью средств просмотра.Можете ли вы дать мне совет?

Это мой код:

import { Component } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { map, startWith } from 'rxjs/operators';

const CACHE_KEY = 'httpSalesCache';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  repos;

  constructor(http: HttpClient){

    const path = 'http://www.mocky.io/v2/x';
    this.repos = http.get<any>(path)

    .pipe(map(data => data.items));

    this.repos.subscribe(next => {
      localStorage[CACHE_KEY] = JSON.stringify(next);
    });

    this.repos = this.repos.pipe(
      startWith(JSON.parse(localStorage[CACHE_KEY] || '[]'))
    ) 
  }
}

Это ответ на звонок http:

{"items":[
{"pdv": 1, 
    "status": "a"
}]}

1 Ответ

0 голосов
/ 28 ноября 2018

Вы можете сделать это, используя встроенную функцию TypeScript filter().Источник: https://www.tutorialspoint.com/typescript/typescript_array_filter.htm

const data = {
  "items": [
    {
      "pdv": 1,
      "status": "a"
    }]
};

const filterValue = 1;
const result = data.items.filter(element => {
  return element.pdv === filterValue;
});

result будет содержать массив всех items, содержащих свойство pdv со значением 1;

EDIT , обновляется после вашего комментария

РЕДАКТИРОВАТЬ 2 Я понял, что вам не нужна переменная для сохранения результата, вы можете просто обновить наблюдаемую

filterValue = 1;

path = 'http://www.mocky.io/v2/x';
this.repos = http.get<any>(path).pipe(
        map(data => { 
            data.items = data.items.filter(element => {
                return element.pdv === filterValue;
              });
        }));
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...