带有多个参数 HTML 的 Angular 6 管道

Question

我有以下管道：

import {Pipe, PipeTransform} from '@angular/core';
@Pipe({
name: 'isInPast'
})
export class IsInPastPipe implements PipeTransform {
transform(date: Date, time: any) {
let today = new Date();
if (date < today) {
return 'inPast';
}
return '';
}
}

这需要两个参数。

现在我希望在我的 html 中发送这些内容，但我不知道如何发送。 我试过：

[ngClass]="isInPast:row.day:task.time"

我也尝试过：

[ngClass]="row.day task.time | isInPast:row.day:task.time"

谁能告诉我我该怎么做？

Answer 1

import {Pipe, PipeTransform} from '@angular/core';
@Pipe({
name: 'isInPast'
})
export class IsInPastPipe implements PipeTransform {
transform(date: Date, time: any) {
// I don't know what type is at time, let's assume it is Date type.
let today = time || new Date();
if (date < today) {
return 'inPast';
}
return '';
}
}

[ngClass]="row.day | isInPast: task.time"

Answer 2

如果要根据日期切换inPast类，请像这样实现它：

import {Pipe, PipeTransform} from '@angular/core';
@Pipe({
name: 'isInPast'
})
export class IsInPastPipe implements PipeTransform {
transform(date: Date, time: any) {
let today = new Date();
if (date < today) {
return true;
}
return false;
}
}

然后像这样应用它

[ngClass]="{'inPast' : row.day | isInPast:task.time }"

Answer 3

{{ yourData | isInPast: 'arg1':'arg2':'arg3'... }}

如何调用具有多个参数的 Angular 2 管道？