AngularJS

[raichu]

Is it possible to use fabric.js with AngularJS?
I gave it a try, but apparently none of the functions I gave to canvas.on.() got run.

Is AngularJS eating up all events?
I wonder if there's a way of getting fabric.js work with AngularJS.

[raichu]

The events were passing through fine, I just needed to call $scope.$apply();
Sorry about filing an invalid issue!

[MeLight]

@raichu can you please provide and example of where you put $scope.apply();? I'm struggling with the same issue.

[raichu]

I call it whenever the UI needs to be updated (canvas events for example).
You should use $scope.$apply(), not $scope.apply(), maybe this is the source of your problem?

By the way, to avoid unnecessary updates, you can use

        if (!$scope.$$phase) {
            $scope.$apply();
        }

[MeLight]

I wanted to call it on canvas events also, but I encountered another problem even before that. my fabric.Canvas is inited on window.onload event, but angularjs is inited beforehand - thus when trying to use canvas inside a controller I get canvas undefined errors. Any idea how to avoid that?
Thanks

[raichu]

How about... by not doing that?
I create new fabric.Canvas object inside the controller.

[loganpowell]

@MeLight ... I'm going to be facing a very similar use case to what you are trying to accomplish here. Did you ever figure it out?

[MeLight]

@loganpowell hi logan. I kinda brute forced it. I created the canvas element in window.onload, and simply checked if it's defined in every angular function I use it.

[shurui91]

1. I am kinda surprised Angular does not have any directives related to canvas available./
2. Is writing a directive by myself for Fabric.js sounds like a possible solution for this issue?

[asturur]

I wish i could help you but i really do not know angular. I mean you do not need a directive for canvas for use fabricjs. once the element is ready on the dom just initialize the library.

[shurui91]

I know we can use Fabric.js in Angular but I am just trying to see if there is a more elegant way to do so. Plugging some non-angular code into an Angular project might not be something can be easily maintained by someone else. But still, thanks for your feedback!

[asturur]

check the kitchensink deno, is built with angular.

[shurui91]

Can you provide a link for that? Thanks. @asturur

[keetstream]

I wanted to call it on canvas events also, but I encountered another problem even before that. my fabric.Canvas is inited on window.onload event, but angularjs is inited beforehand - thus when trying to use canvas inside a controller I get canvas undefined errors. Any idea how to avoid that?
Thanks

I wanted to call it on canvas events also, but I encountered another problem even before that. my fabric.Canvas is inited on window.onload event, but angularjs is inited beforehand - thus when trying to use canvas inside a controller I get canvas undefined errors. Any idea how to avoid that?
Thanks

Still facing this issue of not being able to access class's properties inside canvas.on event listener

[asturur]

@keetstream the i m not sure if your issue relates to the original question, if it does, is probably a matter of mastering angularJS initialization

[keetstream]

hi asturur, I believe so, I got it working though, weirdly enough