Nano Hash - криптовалюты, майнинг, программирование

Angular 2: как использовать фильтр Observable

У меня есть служба, которая вызывает API следующим образом:

return this._http
        .post(appSettings.apiUrl + 'SomeController/SomeAction', params, {withCredentials: true, headers: this.headers})
        .timeoutWith(appSettings.maxTimeHttpCalls, Observable.defer(() => Observable.throw(this._feedbackService.timeout())))
        .map((response: Response) => response.json().data);

Теперь я хочу реализовать функцию фильтра для этого вызова, используя rxjs/add/operator/filter, но я не могу заставить ее работать должным образом.

Это подход, который я выбрал:

return this._http
        .post(appSettings.apiUrl + 'SomeController/SomeAction', params, {withCredentials: true, headers: this.headers})
        .timeoutWith(appSettings.maxTimeHttpCalls, Observable.defer(() => Observable.throw(this._feedbackService.timeout())))
        .filter(response => response.json().data.Type === 5)
        .map((response: Response) => response.json().data);

Но независимо от того, что я фильтрую, цикл ngFor ничего не производит, пока там находится фильтр. Если я удалю его, все будет работать как положено.

Я должен добавить фильтр до или после map?

Могу ли я фильтровать ответ JSON таким образом или мне нужно использовать другой синтаксис?

Пример JSON

Вот пример того, как выглядит ответ JSON:

data: [
    {
        "Type": 5,
        "Description": "Testing",
        "ID": "001525"
    }
]
angular observable rxjs
18.10.2016

  • Наиболее вероятное объяснение состоит в том, что там поле Type поля данных json не равно 5. Что такое JSON? 18.10.2016

Ответы:


1

Должен ли filter() быть до или после map(), зависит от того, что вы хотите сделать.

Я предполагаю, что в вашем случае map() должен идти перед filter(), потому что вы хотите сначала декодировать данные из JSON, а затем фильтровать их. То, как вы это сделали сейчас, ничего не вернет, если условие в filter() разрешается в false, потому что вы используете in для всего response. Может быть, это то, что вы собираетесь ...

Я не знаю, какова ваша структура ответа, но я бы выбрал что-то вроде этого, что имеет больше смысла:

map((response: Response) => response.json().data),
filter(data => data.Type === 5),

Редактировать:

Я бы использовал concatMap() с from() для преобразования массива в поток Observable:

pipe(
  map(content => response.json().data),
  concatMap(arr => Observable.from(arr)),
  filter(item => item.Type === 5),
).subscribe(val => console.log(val));

Посмотреть демонстрацию в реальном времени: http://plnkr.co/edit/nu7jL7YsExFJMGpL3YuS?p=preview

Январь 2019 г.: обновлено для RxJS 6

18.10.2016
  • Я добавил несколько примеров JSON. Я пробовал ваш способ с фильтром последним и фильтровал как data.Type === 5, так и data.ID === '001525', но оба терпят неудачу. 18.10.2016
  • @GlennUtter Я так и думал. data — это массив объектов, но map((response: Response) => response.json().data) возвращает его как один большой массив, который затем передается в фильтр. Итак, вы хотите повторить результат и вернуть только объекты, где data.Type === 5? 18.10.2016
  • @GlennUtter Это немного сложнее. Смотрите мой обновленный ответ с демонстрацией. 18.10.2016
  • Спасибо, сэр. Я изменил свой код, но получаю Property 'Type' does not exist on type '{}', когда делаю это внутри инструкции фильтра. 18.10.2016
  • @GlennUtter Хорошо, это ошибка TypeScript при компиляции? Вместо этого вы можете использовать item['Type'] или определить правильный тип в .filter(item:Whatevertypeitis => ... 18.10.2016

    • 2

    Вот еще один образец, основанный на ответе @martin:

      public searchMediData(searchtearm: string) : Observable<MediData[]> 
  {  

    return this.http
               .get(this.url)
               .map(response => { 
                  let data = response.json();
                  let medidata = data as MediData[];
                  return medidata;
                })
                .concatMap(array => Observable.from(array))
                .filter(medi => {
                        let searchTearmUpperCase = searchtearm.toUpperCase();
                        let mediNameUpperCase = medi.Name.toUpperCase();                       
                        return mediNameUpperCase.includes(searchTearmUpperCase);
                 })
                .toArray();
  }
    12.03.2017
  • вы можете просто написать .map(response =› response.json().data как MediData[]). 11.12.2019
    • Новые материалы
    Кластеризация: более глубокий взгляд
    Кластеризация — это метод обучения без учителя, в котором мы пытаемся найти группы в наборе данных на основе некоторых известных или неизвестных свойств, которые могут существовать. Независимо от..
    Как написать эффективное резюме
    Предложения по дизайну и макету, чтобы представить себя профессионально Вам не позвонили на собеседование после того, как вы несколько раз подали заявку на работу своей мечты? У вас может..
    Частный метод Python: улучшение инкапсуляции и безопасности
    Введение Python — универсальный и мощный язык программирования, известный своей простотой и удобством использования. Одной из ключевых особенностей, отличающих Python от других языков, является..
    Как я автоматизирую тестирование с помощью Jest
    Шутка для победы, когда дело касается автоматизации тестирования Одной очень важной частью разработки программного обеспечения является автоматизация тестирования, поскольку она создает..
    Работа с векторными символическими архитектурами, часть 4 (искусственный интеллект)
    Hyperseed: неконтролируемое обучение с векторными символическими архитектурами (arXiv) Автор: Евгений Осипов , Сачин Кахавала , Диланта Хапутантри , Тимал Кемпития , Дасвин Де Сильва ,..
    Понимание расстояния Вассерштейна: мощная метрика в машинном обучении
    В обширной области машинного обучения часто возникает необходимость сравнивать и измерять различия между распределениями вероятностей. Традиционные метрики расстояния, такие как евклидово..
    Обеспечение масштабируемости LLM: облачный анализ с помощью AWS Fargate и Copilot
    В динамичной области искусственного интеллекта все большее распространение получают модели больших языков (LLM). Они жизненно важны для различных приложений, таких как интеллектуальные..