Javascript 如何在angular2中使用froala事件

Javascript 如何在angular2中使用froala事件,javascript,angular,froala,Javascript,Angular,Froala,我在angular2项目中使用froala。我已成功上载图像,但无法触发图像。上载的事件。在froala文档中,事件是这样的 $('.selector').on('froalaEditor.image.uploaded', function (e, editor, response) { // Do something here. }); 但是我无法在ts代码中实现这一点。事件可以按照官方文档中的建议直接使用选项注册 Ts代码 public options: Object = {

我在angular2项目中使用froala。我已成功上载图像,但无法触发
图像。上载的
事件。在froala文档中,事件是这样的

$('.selector').on('froalaEditor.image.uploaded', function (e, editor, response) {
  // Do something here.
});

但是我无法在ts代码中实现这一点。

事件可以按照官方文档中的建议直接使用选项注册

Ts代码

 public options: Object = {
      placeholder: "Edit Me",
      events : {
        'froalaEditor.focus' : function(e, editor) {
          console.log(editor.selection.get());
        }
      }
    }
模板部件

 <div [froala-editor]="options"></div>

可以按照官方文档中的建议直接使用选项注册事件

Ts代码

 public options: Object = {
      placeholder: "Edit Me",
      events : {
        'froalaEditor.focus' : function(e, editor) {
          console.log(editor.selection.get());
        }
      }
    }
模板部件

 <div [froala-editor]="options"></div>

另外一件在线很难找到的事情是如何使用angular2中froala的方法

从中,可以看到item.action,因此可以将其用作angular2中的item.action()。例如,使用隐藏工具栏

类型脚本

export class FroalaEditor {
    public editor;
    public model: string = '';
    public options: Object = {
        events: {
            'froalaEditor.initialized': (e, editor) {
                this.editor = editor;
            }
        }
    }

    showToolBar() {
        this.editor.toolbar.show();
    }
}
HTML

<div [froalaEditor]="options" [(froalaModel)]="model"></div>

另外一件在线很难找到的事情是如何使用angular2中froala的方法

从中,可以看到item.action,因此可以将其用作angular2中的item.action()。例如,使用隐藏工具栏

类型脚本

export class FroalaEditor {
    public editor;
    public model: string = '';
    public options: Object = {
        events: {
            'froalaEditor.initialized': (e, editor) {
                this.editor = editor;
            }
        }
    }

    showToolBar() {
        this.editor.toolbar.show();
    }
}
HTML

<div [froalaEditor]="options" [(froalaModel)]="model"></div>