动态更新froala工具栏图标

Question

在我的angular应用程序中，我有一个下拉列表，下面还有一个froala编辑器。根据下拉列表的选择，应更新froala编辑器的工具栏图标。请看下面的代码

froala.component.html

        <select  [(ngModel)]="selectedType" (change)="customizeEditorButtons()" > 
         <option value="1"> Option 1 </option> 
         <option value="2"> Option 2 </option> 
        </select>


<textarea [froalaEditor]="editorOptions" [(froalaModel)]="froalaContent"></textarea>

froala.component.ts

this.editorOptions = {
   toolbarButtons: this.toolBarbuttonsModified
}

 public customizeEditorButtons(){
  this.toolBarbuttonsModified = [ 'redo' , '-', 'bold', 'italic'];
}

customizeEditorButtons()函数不会更新froala编辑器，因为它已经在init上呈现。那么，动态更新工具栏图标的选项是什么？

Answer 1

我已经找到了解决这个问题的办法。在下拉列表发生更改时，销毁当前实例，并使用新的工具栏按钮再次初始化它。

public customizeEditorButtons(initControls){
  initControls.destroy();
  this.toolBarbuttonsModified = [ 'redo' , '-', 'bold', 'italic'];
  initControls.initialize();
}

此外，初始化应该是手动的。