如何在Angular中查看数据(订阅)中的字段

import { Component, OnInit } from '@angular/core';
import { DataService } from './data.service';

@Component({
  selector: 'app-data-viewer',
  template: `<div>{{ data | json }}</div>`
})
export class DataViewerComponent implements OnInit {
  data: any;

  constructor(private dataService: DataService) {}

  ngOnInit() {
    this.dataService.getData().subscribe(
      (response) => {
        this.data = response;
      },
      (error) => {
        console.error('Error fetching data', error);
      }
    );
  }
}

import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';

@Component({
  selector: 'app-data-viewer',
  template: `<div>{{ data | json }}</div>`
})
export class DataViewerComponent implements OnInit, OnDestroy {
  data: any;
  private destroy$ = new Subject<void>();

  constructor(private dataService: DataService) {}

  ngOnInit() {
    this.dataService.getData()
      .pipe(takeUntil(this.destroy$))
      .subscribe(
        (response) => {
          this.data = response;
        },
        (error) => {
          console.error('Error fetching data', error);
        }
      );
  }

  ngOnDestroy() {
    this.destroy$.next();
    this.destroy$.complete();
  }
}

this.dataService.getData().subscribe(
  (response) => {
    this.data = response;
  },
  (error) => {
    console.error('Error fetching data', error);
  }
);