在Angular中，如何在@Input变量改变后更新TinyMCE编辑器内容？

在Angular中，可以使用 ngOnChanges 生命周期钩子 函数 来监听 @Input 变量的改变，并在变量改变后更新TinyMCE编辑器的内容。

首先，确保已经安装了 ngx-tinymce 库，可以通过运行以下命令来安装：

npm install ngx-tinymce
然后，创建一个新的组件，例如EditorComponent，并在其中使用TinyMCE编辑器。在该组件中，定义一个@Input变量来接收外部传入的内容，并在ngOnChanges函数中监听变量的改变。
import { Component, Input, OnChanges, SimpleChanges } from '@angular/core';
@Component({
  selector: 'app-editor',
  template: `<ngx-tinymce [init]="editorConfig" [(ngModel)]="editorContent"></ngx-tinymce>`
export class EditorComponent implements OnChanges {
  @Input() content: string;
  editorContent: string;
  editorConfig: any = {
    // TinyMCE配置
  ngOnChanges(changes: SimpleChanges) {
    if (changes.content && !changes.content.firstChange) {
      this.editorContent = changes.content.currentValue;
在上述代码中，EditorComponent组件接收一个content变量作为输入，并将其绑定到TinyMCE编辑器的ngModel上。然后，在ngOnChanges函数中，监听content变量的改变，并将最新的值赋给editorContent变量，以更新编辑器的内容。
使用该组件时，可以在父组件中传入content变量，并在变量改变时，EditorComponent会自动更新编辑器的内容。
import { Component } from '@angular/core';
@Component({
  selector: 'app-parent',
  template: `<app-editor [content]="editorContent"></app-editor>`
export class ParentComponent {
  editorContent: string = '初始化内容';
  updateContent() {
    // 更新content变量的值，EditorComponent会自动更新编辑器的内容
    this.editorContent = '更新后的内容';
在上述代码中，ParentComponent组件包含一个editorContent变量，并将其传递给EditorComponent的content输入属性。当updateContent方法被调用时，editorContent变量的值会被更新，从而触发EditorComponent中的ngOnChanges函数，并更新编辑器的内容。
希望以上解决方案对您有所帮助！