在模板驱动的嵌套表单中动态多实例编辑器

Question

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

1)我可以创建多个实例的时间编辑器，如果我使用它直接在模板驱动的形式，提供'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">

2. 如果我在嵌套表单(模板驱动)中使用它，我可以使用ngForm指令(
   )访问它，我仍然可以通过传递id ("myidone")创建多个tinymce编辑器实例。和"myidtwo")作为输入值。

在父:

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

嵌套的定时组件/模板

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

3. 问题是如何获得id "myidone"单独的值和"myidtwo" ?当只有一个实例时，我可以使用this.form.value.进行访问。我试着传递"姓名"属性，但不工作。它给我错误(所有组合)

   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.
   

4. 我可以删除name"属性声明为"独立"，但在这种情况下，我怎么能通过Id(模板驱动)访问嵌套的表单值?

5. 还有其他解决方案吗?

Thanks in advance

Answer 1

不确定如果我得到它正确，但你想使用多个tinyeditor在一个反应形式?

我已经在stackblitz上添加了相同的实现。

这里的

• 代码:
这里的
• 输出:

请看