Question

我想将标题栏管道与alvis运算符一起应用，并且无法按预期工作。虽然alvis运算符可以使'number'管道按预期工作，并且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

尝试如何？

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

Answer 2

要使用TitleCasePipe或任何其他需要同步值的管道来处理异步数据，请使用AsyncPipe解开解析/发出的数据（与Promise和{{1一起使用） }}）：

Observable

Answer 3

Titlecase管道要求包含@ angular / common中的CommonModule。您能否检查是否已添加该模块？

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

3 个答案: