Search code examples
javascriptangularjsopenseadragon

Binding AngularJS with JavaScript Plugin

I'm trying to bind AngularJS with JavaScript Plugin - OpenSeaDragon, because I have to do annotations on OpenSeaDragon's image and I tried something like this

angular.element(document.body).scope().$on('addAnnotation', function(e, data){    
    self._viewer.viewport.fitBounds(new OpenSeadragon.Rect(data)) 
});

And inside the controller:

$scope.addAnnotation= function (data) { 
   $scope.$root.$emit('addAnnotation', data);
}

And in my view:

ng-click="addAnnotation(data)"

but I am getting error 

Uncaught TypeError: Cannot read property '$on' of undefined
Solution

  • You are trying to get angular.element(document.body).scope() which is undefined. In order to get the scope of an element, this element should have a scope. Try using it on a DOM element that binds to a controller.