Блог

Я использую редактор tinymce для своего проекта angular 12

1)Я могу создать несколько экземпляров редактора tinymce, если буду использовать его непосредственно в форме, управляемой шаблоном, при условии, что «идентификатор» уникален

    <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 (<форма #форма=»ngForm»>), я все равно смогу создать несколько экземпляров редактора tinymce, передав идентификаторы («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">
 

3. Проблема в том, как получить отдельные значения для идентификаторов «myidone» и «myidtwo»? Когда был только один экземпляр, я смог получить доступ с помощью этого.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. Я могу удалить атрибут «имя», объявив его «автономным», но в этом случае как я могу получить доступ к значениям вложенных форм по идентификатору (управляемому шаблоном)?
5. Есть ли другое альтернативное решение?

Заранее спасибо

Не уверен, правильно ли я понял, но вы хотите использовать несколько миниатюрных редакторов в реактивной форме?

Я добавил реализацию того же в stackblitz.

• Код: здесь
• Вывод: здесь

Пожалуйста, взгляните.