View source

jsplumbInstance
directive in module ovh-angular-jsplumb

Description

Create the jsPlumb environment

Example

    // script.js
    angular.module("myApp", ["ovh-angular-jsplumb"]);
    angular.module("myApp").controller("foo", function() {
         var self = this;

         this.instanceOptions = {
              PaintStyle : {
                  lineWidth : 2,
                  strokeStyle : "#354291"
              },
              HoverPaintStyle : {
                  lineWidth : 4,
                  strokeStyle : "#354291"
              },
              MaxConnections : -1
         };


         $scope.$on("jsplumb.instance.created", function (evt, instance) {
             self.jsPlumb = instance;
             instance.Defaults.Container=$("body");
         });

        function init() {
           self.jsplumbReady = false;
           jsPlumbService.jsplumbInit().finally(function () {
               self.jsplumbReady = true;
           });

        }

        init();
    });
    <div data-ng-if="Foo.jsplumbReady" data-jsplumb-instance="Foo.instanceOptions">

    </div>

Usage

as attribute
<ANY jsplumb-instance>
   ...
</ANY>

Directive info

  • This directive creates new scope.