Question

观察更改没有问题，但将其与[（ngModel）]连接。

代码：

import {Component} from 'angular2/core'

@Component({
  selector: 'main',
  template: `

  <textarea [(ngModel)]="comment" name="editor1" id="editor1"></textarea>
  <div *ngIf="comment">
    {{comment}}
  </div>
  `
})

export class MainComponent {

  ngOnInit(){
     //this.editor = window['CKEDITOR']['replace']( 'editor1' );
     window['CKEDITOR']['replace']( 'editor1' )['on']('change', function( evt ) {
       this.comment = evt.editor.getData();
       console.log( 'comment = ' + this.comment );
     })
  }

  comment: any = "default";
}

因此，页面加载时默认

  <div *ngIf="comment">
    {{comment}}
  </div>

Angular2打印“默认”文本 - 正确。问题是当我在ckeditor中编辑文本时。然后仍有“默认”文本，但在控制台中感谢：

console.log( 'comment = ' + this.comment );

正确查看文字。所以有什么问题？为什么{{comment}}只能看到“comment”变量的起始版本？怎么解决？谢谢你的帮助。

Answer 1

尝试在区域内运行：

export class MainComponent {
  constructor(private zone:NgZone){}
  ngOnInit(){
     //this.editor = window['CKEDITOR']['replace']( 'editor1' );
     window['CKEDITOR']['replace']( 'editor1' )['on']('change', function( evt ) {
       this.zone.run(function(){
         this.comment = evt.editor.getData();
         console.log( 'comment = ' + this.comment );
       });

     })
  }

  comment: any = "default";
}

Angular2 + CKEditor - 观察变化

1 个答案: