Angular中如何给ngClass调用的Pipe传递多个参数？

Angular 里给 Pipe 传递多个参数的正确语法是用**冒号:**分隔，你之前的写法顺序有误，参数要放在 Pipe 名称后面，而非原始值与 Pipe 之间。

模板端正确写法 #

将第二个参数放在 Pipe 名称后，用冒号隔开：

<li [ngClass]="time | style: secondparam"></li>

如果需要传递更多参数，继续追加冒号和参数即可：

<li [ngClass]="time | style: secondparam: thirdparam"></li>

Pipe 的 transform 方法接收参数 #

你的 transform 方法当前用数组接收后续参数，可直接通过数组索引获取传入的参数：

transform(value: any, ...args: any[]): any {
  // args[0] 就是你传入的 secondparam
  // args[1] 对应第三个参数（如果有传递）
  // 示例逻辑：根据 value 和参数返回对应的类名
  if (value === 'morning' && args[0] === 'weekday') {
    return 'morning-weekday-style';
  }
  // 其他业务逻辑...
}

也可以直接指定参数名称，让代码更直观：

transform(value: any, secondParam: any, thirdParam?: any): any {
  // 直接使用 secondParam 变量，无需数组索引
  if (value === 'morning' && secondParam === 'weekday') {
    return 'morning-weekday-style';
  }
  // 其他业务逻辑...
}

内容的提问来源于stack exchange，提问作者user3653474