Конвейеры - это фильтры для преобразования данных (форматов) в шаблоне.

Я наткнулся на функцию pipe (), как показано ниже. Что именно означает эта функция pipe () в данном случае?

return this.http.get(url)
  .pipe(
    tap(_ => this.log(`fetched hero id=${id}`)),
    catchError(this.handleError(`getHero id=${id}`))
);

Ответы (5)

Каналы, о которых вы говорите в начальном описании, отличаются от каналов, которые вы показали в примере.

В Angular (2 | 4 | 5) каналы используются для форматирования представления, как вы сказали. Я думаю, у вас есть базовое представление о каналах в Angular, вы можете узнать больше об этом по этой ссылке - Angular Pipe Doc

pipe (), который вы показали в примере, - это pipe () метод RxJS 5.5 (RxJS является значением по умолчанию для всех приложений Angular) . В Angular5 все операторы RxJS могут быть импортированы с использованием единого импорта, и теперь они объединяются с использованием метода конвейера.

tap () - оператор tap RxJS будет смотреть на наблюдаемое значение и что-то делать с этим значением. Другими словами, после успешного запроса API оператор tap () выполнит любую функцию, которую вы хотите, чтобы он выполнял с ответом. В этом примере он просто регистрирует эту строку.

catchError () - catchError делает то же самое, но с ошибкой. Если вы хотите вызвать ошибку или вызвать какую-либо функцию, если вы получили сообщение об ошибке, вы можете сделать это здесь. В этом примере он вызовет handleError () и внутри этого просто запишет эту строку.

Два очень разных типа труб Угловые - Трубы и RxJS - Трубы

Угловая труба

Канал принимает данные как входные и преобразует их в желаемый результат. На этой странице вы будете использовать каналы для преобразования свойства дня рождения компонента в удобную для человека дату.

import { Component } from '@angular/core';

@Component({
  selector: 'app-hero-birthday',
  template: `

The hero's birthday is {{ birthday | date }}

` }) export class HeroBirthdayComponent { birthday = new Date(1988, 3, 15); // April 15, 1988 }

RxJS - Труба

Наблюдаемые операторы состоят из конвейерного метода, известного как конвейерные операторы. Вот пример.

import {Observable, range} from 'rxjs';
import {map, filter} from 'rxjs/operators';

const source$: Observable = range(0, 10);

source$.pipe(
    map(x => x * 2),
    filter(x => x % 3 === 0)
).subscribe(x => console.log(x));

Вывод в консоли будет следующим:

0

6

12

18

Для любой переменной, содержащей наблюдаемое, мы можем использовать метод .pipe () для передачи одной или нескольких операторных функций, которые могут работать и преобразовывать каждый элемент в наблюдаемой коллекции.

Итак, в этом примере каждое число в диапазоне от 0 до 10 умножается на 2. Затем функция фильтра фильтрует результат только до нечетных чисел.

Вы должны обратиться к официальной документации ReactiveX: https://github.com/ReactiveX/rxjs/blob/master/doc/pipeable-operators.md.

Это хорошая статья о конвейере в RxJS: https://blog.hackages.io/rxjs-5-5-piping-all-the-things-9d469d1b3f44.

Короче .pipe () позволяет объединять в цепочку несколько конвейерных операторов.

Начиная с версии 5.5 RxJS поставляет «конвейерные операторы» и переименовывает некоторые операторы:

do -> tap
catch -> catchError
switch -> switchAll
finally -> finalize

RxJS Операторы - это функции, которые строятся на основе наблюдаемых объектов и позволяют выполнять сложные манипуляции с коллекциями.

Например, RxJS определяет такие операторы, как map (), filter (), concat ()и flatMap () * 100009. *.

Вы можете использовать каналы для связывания операторов вместе. Каналы позволяют объединить несколько функций в одну.

Функция pipe () принимает в качестве аргументов функции, которые вы хотите объединить, и возвращает новую функцию, которая при выполнении последовательно запускает скомпонованные функции.

Не путайте понятия Angular и RxJS

У нас есть концепция каналов в Angular и pipe () в RxJS.

1) Каналы в Angular: Канал принимает данные в качестве входных и преобразует их в желаемый результат
https://angular.io/guide/pipes

2) pipe () функция в RxJS: вы можете использовать каналы для связывания операторов вместе. Каналы позволяют объединить несколько функций в одну.

Функция pipe () принимает в качестве аргументов функции, которые вы хотите объединить, и возвращает новую функцию, которая при выполнении последовательно запускает скомпонованные функции.
https://angular.io/guide/rx-library (ищите каналы в этом URL, вы можете найти то же самое)

Итак, согласно вашему вопросу, вы имеете в виду pipe () функцию в RxJS

2022 WebDevInsider