在 Angular 18 中找不到 json 管道

Question

在 Angular 18 的干净项目中，管道“json”不起作用。

import {Component} from '@angular/core';
import {bootstrapApplication} from '@angular/platform-browser';

@Component({
  selector: 'app-root',
  standalone: true,
  template: `
    Hello world!
    <p>{{ person | json }}</p>
  `,
})
export class PlaygroundComponent {
  person = {
    name: "Alan",
    position: "full-stack developer",
    salary: 2000
  };
}

bootstrapApplication(PlaygroundComponent);

我收到以下错误：

✘ [ERROR] NG8004: No pipe found with name 'json'. [plugin angular-compiler]

此代码在 Angular 预览版中完美运行。

Angular 18 官方文档中没有 json 管道的示例。

Answer 1

您需要将

JsonPipe

添加到组件的

imports

:

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [JsonPipe],
  template: `
    Hello world!
    <p>{{ person | json }}</p>
  `,
})