angular - 模板驱动嵌套形式的tinymce编辑器的动态多个实例

问题描述

我正在为我的 Angular 12 项目使用 tinymce 编辑器

1）我可以创建tinymce编辑器的多个实例，如果我直接在模板驱动的表单中使用它，只要'id'是唯一的

   <editor [apiKey]="tinymceAPIKey" id="myidone" name="myidone" 
   [(ngModel)]="descriptionone" [init]="tinyMCEEditorService.tinymceInitProp">

    <editor [apiKey]="tinymceAPIKey" id="myidtwo" name="myidtwo" 
    [(ngModel)]="descriptiontwo" [init]="tinyMCEEditorService.tinymceInitProp">

如果我在嵌套表单（模板驱动）中使用它，我可以使用 ngForm 指令（<form #form="ngForm">）访问它，我仍然可以通过传递 id（“myidone”和“ myidtwo") 作为输入值。

内部父母：

   <app-tinymce [id]="myidone" ..></app-tinymce>
   <app-tinymce [id]="myidtwo" ..></app-tinymce>

嵌套的 tinymce 组件/模板

    @Input() editorid: string;
    ... 

        <editor [apiKey]="tinymceAPIKey" [id]="editorid" name="description" 
 [(ngModel)]="description" [init]="tinyMCEEditorService.tinymceInitProp">

问题是如何获得 id "myidone" 和 "myidtwo" 的单独值？当只有一个实例时，我可以使用 this.form.value.<name> 进行访问。我试图动态传递“名称”属性，但没有奏效。它给了我错误（所有组合）

name="{{editorid}}" OR     
[name]="editorid" OR 
[attr.name]="editorid" OR 
attr.name="{{editorid}}"


 Error: If ngModel is used within a form tag, either the name attribute 
 must be set or the form control must be defined as 'standalone' in ngModelOptions.

我可以通过声明为“独立”来删除“名称”属性，但在这种情况下，如何通过 Id（模板驱动）访问嵌套表单值？
还有其他替代解决方案吗？

提前致谢

标签： angulartinymce

angular - 模板驱动嵌套形式的tinymce编辑器的动态多个实例

问题描述

解决方案

推荐阅读