Что такое функция pipe() в Angular 2?
Каналы - это фильтры для преобразования данных (форматов) в шаблон.
Я наткнулся на функцию pipe()
как показано ниже. Что именно означает эта функция pipe()
в этом случае?
return this.http.get<Hero>(url)
.pipe(
tap(_ => this.log('fetched hero id=${id}')),
catchError(this.handleError<Hero>('getHero id=${id}'))
);
Ответы
Ответ 1
Не путайте понятия Angular и RxJS
У нас есть концепция pipe в Angular и функция pipe()
в RxJS.
1) Pipes в угловом формате: pipe принимает данные в качестве входных данных и преобразует их в желаемый выходной сигнал
https://angular.io/guide/pipes
2) Функция pipe()
в RxJS: вы можете использовать каналы для связи операторов. Pipes позволяют объединить несколько функций в одну функцию.
Функция pipe()
принимает в качестве аргументов функции, которые вы хотите объединить, и возвращает новую функцию, которая при выполнении запускает составные функции в последовательности.
https://angular.io/guide/rx-library (ищите pipes в этом URL, вы можете найти то же самое)
Итак, в соответствии с вашим вопросом, вы ссылаетесь на функцию pipe()
в RxJS
Ответ 2
Pipes, о которых вы говорите в начальном описании, отличаются от pipes, которую вы показали в примере.
В Angular (2 | 4 | 5) pipes используются для форматирования вида, как вы сказали. Я думаю, что у вас есть общее представление о pipeх в Angular, вы можете узнать больше об этом по этой ссылке - Angular Pipe Doc
pipe()
, который вы показали в примере, является методом pipe()
для RxJS 5.5 (RxJS является значением по умолчанию для всех приложений Angular). В Angular5 все операторы RxJS можно импортировать с помощью одного импорта, и теперь они объединяются с помощью метода pipe.
tap()
- Оператор касания RxJS будет смотреть на наблюдаемое значение и что-то делать с этим значением. Другими словами, после успешного запроса API оператор tap()
выполнит любую функцию, которую вы хотите выполнить с ответом. В этом примере он просто запишет эту строку.
catchError()
- catchError делает то же самое, но с ошибкой. Если вы хотите вызвать ошибку или вызвать какую-то функцию, если вы получили ошибку, вы можете сделать это здесь. В этом примере он будет вызывать handleError()
, а внутри него будет просто записывать эту строку.
Ответ 3
Операторы RxJS - это функции, которые основаны на основе наблюдаемых, чтобы обеспечить сложные манипуляции с коллекциями.
Например, RxJS определяет операторы, такие как map()
, filter()
, concat()
и flatMap()
.
Вы можете использовать каналы, чтобы связать операторов вместе. Трубы позволяют объединить несколько функций в одну функцию.
Функция pipe()
принимает в качестве аргументов функции, которые вы хотите объединить, и возвращает новую функцию, которая, при выполнении, запускает составные функции в последовательности.
Ответ 4
Вы должны обратиться к официальной документации ReactiveX:
https://github.com/ReactiveX/rxjs/blob/master/doc/pipeable-operators.md.
Это хорошая статья о pipeопроводе в 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