如何检测角度为 2 的 div 中的内部 html 变化？

我有一个类似的组件

@Component({
  selector: 'my-component',
  template: '<div id="myDiv">Some value comes here dynamically from server</div>',
})
class MyComponent implements OnInit {
@Input()

  ngOnInit() {
      //execute my function when a content change is occured in #myDiv      
  });
 }
}

如果“#myDiv”中发生内容更改，我想执行一个函数。 我怎样才能实现这个功能？ 我还尝试了角度的（更改）事件。

虽然看起来很简单，但是可以使用子组件和输入、输出变量来实现。

用于显示服务内容的子组件

@Component({
  selector: 'title',
  template: `
    <div> {{title}}</div> 
  `,
})
export class TitleComponent implements ngOnChanges{

  @Input() title:string="";
  @Output() titleChanged:EventEmitter<string>=new EventEmitter<string>();
  constructor(){
  //service call goes here
  }
  ngOnChanges(){
  console.log(this.val);
  this.titleChanged.emit(this.title);
  } 

}

父组件将是

@Component({
  selector: 'my-app',
  template: `
    <div>
      <h2>Hello {{name}}</h2>
      <title (titleChanged)="changedTitle($event)" [title]="title"></title>
    </div>
  `,
})
export class App {
  name:string; 
  title:string="some title";
  val:string;
  constructor() {
    this.val="";

  }

   changedTitle(va){
    console.log(va);

  }
}

解释：

1. 当进行服务调用并且标题值发生更改时。
2. 当输入属性发生变化时，ngOnChanges 将被自动触发。
3. The 标题已更改是 Output() 变量，并在执行 ngOnChanges 时发出一个值。
4. 当 titleChanged 被触发时，关联方法中更改标题()将被执行。

现场演示 https://plnkr.co/edit/aSyZsV7M2BRJgWExVSWE?p=preview

注意：为了表明这是有效的，我使用了一个文本框并将其分配给 div 元素。