如何在angular中显示单个json对象

<div>
  <h2>JSON Display</h2>
  <p>Property: {{ jsonData.property }}</p>
  <p>Value: {{ jsonData.value }}</p>
</div>

import { Component } from '@angular/core';

@Component({
  selector: 'app-json-display',
  templateUrl: './json-display.component.html',
  styleUrls: ['./json-display.component.css']
})
export class JsonDisplayComponent {
  jsonData: any;

  constructor() {
    // 初始化jsonData变量，或从后端API获取JSON数据并赋值给它
    this.jsonData = {
      property: 'Example',
      value: '123'
    };
  }
}

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import { JsonDisplayComponent } from './json-display/json-display.component';

@NgModule({
  declarations: [
    AppComponent,
    JsonDisplayComponent
  ],
  imports: [
    BrowserModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }