[ngClass] 上的 angular2 管道表达式不起作用

Question

我有一个管道将动态输入字符串中的第一个字母大写

@Pipe({
  name: 'capitalize'
})
export class CapitalizePipe implements PipeTransform {

transform(value: string, args: any[]): string {
if (value === null) return 'Not assigned';
return value.charAt(0).toUpperCase() + value.slice(1);
 }
}

管道在 [ngClass] 内部不接受

[ngClass]="data.color | capitalize"> // data.color is json input --> not capitalizing input string

<md-input-container>
    <input mdInput placeholder="Severity" value="{{ data.color }}" readonly>
    <md-icon [ngClass]="data.color+''|capitalize"></md-icon>
  </md-input-container>

当我打印为{{data.color |大写}}它工作正常 input = "name" 打印为 "Name"。任何帮助都会很棒。

Answer 1

你可以试试这个：

[ngClass]="data.color+'' | capitalize"

而不是：

[ngClass]="data.color | capitalize"

并检查您的管道是否在您的模块声明中声明。 Plunker 显示确切的实现。

[ngClass] 上的 angular2 管道表达式不起作用

angular2 Pipe expression on [ngClass] not working

angular2-pipe

angular