什么是管道()函数在角度

管道是用于在模板中转换数据(格式)的过滤器。

我看到了下面的 pipe()函数。这个 pipe()函数在这里到底是什么意思？

return this.http.get<Hero>(url)
.pipe(
tap(_ => this.log(`fetched hero id=${id}`)),
catchError(this.handleError<Hero>(`getHero id=${id}`))
);
203399 次浏览
小开

开始描述中所讨论的管道与示例中显示的管道不同。

在角度(2 | 4 | 5)管是用来格式化视图，如你所说。我认为你有一个基本的理解管在角度，你可以从这个链接学到更多-角管医生

示例中显示的 pipe()是 RxJS 5.5的 pipe()方法(RxJS 是所有 Angular 应用程序的默认值)。在 Angular5中，所有的 RxJS操作符都可以使用单个导入进行导入，现在它们可以使用管道方法进行组合。

RxJS 抽头运算符将查看可观测值并对该值进行处理。换句话说，在一个成功的 API 请求之后，tap()操作符将对响应执行您希望它执行的任何函数。在这个示例中，它将只记录该字符串。

CatchError 完全做同样的事情，但是使用错误响应。如果你想抛出一个错误或者想调用某个函数如果你得到一个错误，你可以在这里做。在这个例子中，它将调用 handleError()，在这个例子中，它将记录这个字符串。

小开

不要与角度和 RxJS 的概念混淆

我们有角度的管道概念和 RxJS 的 pipe()函数。

1) 角度管: 管道接收数据作为输入，并将其转换为所需的输出
Https://angular.io/guide/pipes

2) RxJS 中的 pipe()函数: 你可以用管道把运算符连接在一起。管道可以让你把多个函数组合成一个函数。

pipe()函数将要组合的函数作为其参数，并返回一个新函数，该函数在执行时按顺序运行组合的函数。
Https://angular.io/guide/rx-library (在此 URL 中搜索管道，可以找到相同的内容)

因此，根据您的问题，您正在引用 RxJS 中的 pipe()函数

小开

您必须查看正式的 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.

简而言之. tube ()允许链接多个可管道操作符。

从5.5版本开始，RxJS 提供了“可管道运算符”，并重命名了一些运算符:

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

RxJS 操作符是构建在观察基础上的函数，可以对集合进行复杂的操作。

例如，RxJS 定义了诸如 map()、 filter()、 concat()和 flatMap()之类的运算符。

您可以使用管道将运算符连接在一起。

pipe()函数将要组合的函数作为其参数，并返回一个新函数，该函数在执行时按顺序运行组合的函数。

小开

两种非常不同类型的管道 < em > 角形管道 和 < em > RxJS-Pipes

角管

管道接收数据作为输入，并将其转换为所需的输出。在本页中，您将使用管道将组件的生日属性转换为对人友好的日期。

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


@Component({
selector: 'app-hero-birthday',
template: `<p>The hero's birthday is \{\{ birthday | date }}</p>`
})
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<number> = range(0, 10);


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

控制台中的输出如下:

0

6

12

18

对于任何保存可观测数据的变量，我们可以使用。方法传递一个或多个运算符函数，这些函数可以处理和转换可观察集合中的每个项。

这个例子取0到10之间的每个数，再乘以2。然后，过滤器函数将结果过滤到只剩下奇数。


提交答案