如何检测Angular 2中的属性是否发生了变化？

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

@Component({
  selector: 'app-example',
  template: `
    <div>{{ data }}</div>
    <button (click)="updateData()">Update Data</button>
  `
})
export class ExampleComponent {
  data: string;

  constructor(private cdr: ChangeDetectorRef) {
    this.data = 'Initial data';
  }

  updateData() {
    this.data = 'Updated data';
    this.cdr.detectChanges(); // 手动触发变化检测
  }
}

import { Component, Input, OnChanges, SimpleChanges } from '@angular/core';

@Component({
  selector: 'app-child',
  template: `
    <div>{{ data }}</div>
  `
})
export class ChildComponent implements OnChanges {
  @Input() data: string;

  ngOnChanges(changes: SimpleChanges) {
    if (changes.data) {
      console.log('Data changed:', changes.data.currentValue);
    }
  }
}