Bootstrap-wysihtml5 Angular Directive does not update correctly on change

I am currently trying to use wysihtml5 with an Angular directive, but I cannot get the change event to fire correctly.

Below is the directive I have set:

app.directive('wysiwyg', ['$parse', function() {
 return {
    restrict: "A",
    require: "?ngModel",
    link: function(scope, element, attrs, ctrl) {

        var change = function() {
            scope.$apply(function(){
                ctrl.$setViewValue($(element).val());
            });
        };

        $(element).wysihtml5({
            "font-styles": true, //Font styling, e.g. h1, h2, etc. Default true
            "emphasis": true, //Italics, bold, etc. Default true
            "lists": true, //(Un)ordered lists, e.g. Bullets, Numbers. Default true
            "html": false, //Button which allows you to edit the generated HTML. Default false
            "link": true, //Button to insert a link. Default true
            "image": true, //Button to insert an image. Default true,
            "color": false, //Button to change color of font
            "events": {
                "change": function() {
                    window.console.log("changed");
                    change();
                },
                "newword:composer": function() {
                    change();
                },
                "paste": function() {
                    change();
                }
            }
        });
    }
 };
}]);

      

        
        
        
      

    

According to the documentation for wysihtml5, this is how you listen to the change element. However, it currently only fires on blur, not on editor changes. Is there another event that I should be looking for, or should I go about this differently with the Angular directive?