Angular 管道标题大小写无效管道错误

Question

我想将 titlecase 管道与 alvis 运算符一起应用，但它没有按预期工作。虽然 'number' 管道与 alvis 运算符一起按预期工作，并且 TitleCasePipe().transform() 也在处理相同的值。

选项 1：Chain: {{information?.chains | titlecase}}

抛出以下错误：

ERROR Error: InvalidPipeArgument: 'bitcoin' for pipe 'TitleCasePipe'
    at invalidPipeArgumentError (common.js:3953)
    at TitleCasePipe.push../node_modules/@angular/common/fesm5/common.js.TitleCasePipe.transform (common.js:4655)
    at checkAndUpdatePureExpressionInline (core.js:9731)
    at checkAndUpdateNodeInline (core.js:10303)
    at checkAndUpdateNode (core.js:10261)
    at debugCheckAndUpdateNode (core.js:10894)
    at debugCheckRenderNodeFn (core.js:10880)
    at Object.eval [as updateRenderer] (UserMenuComponent.html:8)
    at Object.debugUpdateRenderer [as updateRenderer] (core.js:10872)
    at checkAndUpdateView (core.js:10248)

选项 2：Chain: {{'bitcoin' | titlecase}} 按预期将字符串值转换为 'Bitcoin'。

选项 3：console.log(new TitleCasePipe().transform(this.information.chain)); 按预期将变量值 'bitcoin' 转换为 'Bitcoin'。

选项 4：Balance: {{information?.balance | number}} 按预期将变量值 15603911 转换为 15,603,911。

如何在具有异步数据值的 html 视图中使用标题管道？

Answer 1

要使用 TitleCasePipe, or any other pipe that expects a sync value, with async data, unwrap the resolved/emitted data with AsyncPipe（适用于 Promise 和 Observable）：

<p>Balance: {{bitcoin$ | async | titlecase}}</p>

Answer 2

试试怎么样？

<p>Chain: {{ (information?.chains || '') | titlecase}}</p>

Answer 3

Titlecase 管道要求包含来自@angular/common 的 CommonModule。请检查您是否添加了该模块？

Angular 管道标题大小写无效管道错误

Angular Pipe titlecase Invalid Pipe Error

angular-pipe

angular