CODEWITHSUNDEEP
javascriptangularfroala
Suraj Khanal
Suraj Khanal

Reputation: 540

How to use froala events in angular2

I am using froala in my angular2 project. I have successfully uploaded image but cannot trigger the image.uploaded event. In froala document, event is something like this

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

But i am unable to implement this in ts code.

Upvotes: 0

Views: 2222

Answers (2)

Nebojsa Sapic
Nebojsa Sapic

Reputation: 9745

One more thing which is difficult to find online is how to use methods from froala in angular2.

From froala documentation, you can see item.action, so you can use it as item.action() in angular2. For example with hiding toolbar.

TYPESCRIPT:

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>

Upvotes: 2

Suraj Khanal
Suraj Khanal

Reputation: 540

Events can be registered with options directly as suggested in official documentation.

Ts code

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

template part

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

Upvotes: 1

Related Questions