带有多个参数的角度 6 管道 html答案

【问题标题】：angular 6 pipe with multiple arguements html带有多个参数的角度 6 管道 html
【发布时间】：2020-01-10 23:04:55
【问题描述】：

我有以下管道：

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"

谁能告诉我怎么做？

【问题讨论】：

标签： javascript angular

【解决方案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"

【讨论】：

【解决方案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 }"

【讨论】：

【解决方案3】：

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

How do I call an Angular 2 pipe with multiple arguments?

【讨论】：

这里的参数不是字符串，你的数据真的没有意义吗？