テキーラエリアを角度2でバインドする

Question

私はtinymceの使い方を割り当てています。私はドキュメントの基本的なチュートリアルに従ったが、ngModelがtextareaで動作しないかどうかはわかりません。私のコードでは、私のonMessage関数のhtmlBodyは私のtexteareaの内容を送信することです。 htmlBodyのコンテンツが送信されない理由はありますか？関数onMessage（）をトリガすると、htmlBodyのコンテンツは送信されません。それは、これは非常に基本的であり、これは私が単にテキストエリアにngModelを使用せずに何をするのかである私の問題

<div class="tiny"> 


    <div id="tinyFormGroup" class="form-group"> 
     <div class="hidden"> 
      <textarea [(ngModel)]="htmlBody" id="baseTextArea" name="body" >{{htmlBody}}</textarea> 
     </div> 
     </div> 


    </div> 
    <div class="form-group"> 
        <button type="submit" class="btn btn-primary">Submit</button> 


       </form> 

    inputs: ['mceContent'], 
     outputs: ['contentChanged'], 
     providers:[HttpService] 

export class EmailComponent { 

    private elementRef: ElementRef; 
    private elementID: string; 
    private htmlBody = "Write Your Message Here"; 
    private title; 




    public contentChanged: EventEmitter<any>; 


    constructor(@Inject(ElementRef) elementRef: ElementRef, private httpService:HttpService) 
    { 
     this.elementRef = elementRef; 

     var randLetter = String.fromCharCode(65 + Math.floor(Math.random() * 26)); 
     var uniqid = randLetter + Date.now(); 

     this.elementID = 'tinymce' + uniqid; 
     this.contentChanged = new EventEmitter(); 


    } 





    ngAfterViewInit() 
    { 
     //Clone base textarea 
     var baseTextArea = this.elementRef.nativeElement.querySelector("#baseTextArea"); 
     var clonedTextArea = baseTextArea.cloneNode(true); 
     clonedTextArea.id = this.elementID; 

     var formGroup = this.elementRef.nativeElement.querySelector("#tinyFormGroup"); 
     formGroup.appendChild(clonedTextArea); 






     tinymce.init(
      { 


       mode: 'exact', 
       height: 300, 

       theme: 'modern', 

       ], 

       elements: this.elementID, 
       setup: this.tinyMCESetup.bind(this) 
      } 
     ); 
    } 

    tinyMCESetup(ed) { 
     ed.on('keyup', this.tinyMCEOnKeyup.bind(this)); 
    } 

    tinyMCEOnKeyup(e) { 
     this.contentChanged.emit(tinymce.get(this.elementID).getContent()); 
    } 

    set mceContent(content) { 
     this.htmlBody = content; 
    } 

    onMessage(){ 


     this.httpService.addDraft(this.htmlBody) 
     .subscribe(data => { 


     }) 


    } 
} 

Answer 1

です。とても簡単働い

export class EmailComponent { 


     private htmlBody = "Write Your Message Here"; 

     sendMessage = { 

      htmlBody = ""; 

     } 

tinyMCEOnKeyup(e) { 
     this.contentChanged.emit(tinymce.get(this.elementID).getContent()); 
     this.sendMessage.htmlBody = tinymce.get(this.elementID).getContent(); 
     this.contentChanged.emit(this.editor.htmlBody); 

    } 

onSubmit(){ 

     this.httpService.addDraft(this.sendMessage.htmlBody) 
     .subscribe(data => { 

     })