首页 > 解决方案 > MxGraph - Angularjs 1 - 集成

问题描述

我尝试使用angularjs客户端库动态添加 mxgraph。没有找到任何声明相同的相关文件。有人可以帮助我进行这种集成,例如需要集成哪些文件以及从 html 文件中调用什么来使其正常工作。

app.js var app = angular.module('app', ['mxGraph']);

mxcontroller.js:

app.controller('Ctrl', ['$scope', 'mxgraph',
 function($scope, mxgraph) {
          $scope.main = function(container)
     {

             var graph = new mxgraph(container);
             var parent = graph.getDefaultParent();
             graph.getModel().beginUpdate();
             try
             {
                 var v1 = graph.insertVertex(parent, null, 'Hello,', 20, 20, 80, 30);
                 var v2 = graph.insertVertex(parent, null, 'World!', 200, 150, 80, 30);
             }
            finally
             {
                 graph.getModel().endUpdate();
             }
     }; }]);

index.html包括 mxgraphjavascript/src文件夹

mx.html

<div ng-controller="Ctrl as controller" id="content-container">

提前致谢

标签: javascriptangularjsmxgraph

解决方案


除非您已经在为 mxGraph 使用 AngularJS 工厂、服务或提供程序,否则您将需要使用 AngularJS 依赖注入来在您的应用程序中使用它。

例如,在你的控制器之前的某个地方:

let mxGraph = angular.module('mxGraph', []);
mxGraph.factory("mxgraph", function() {
    return window.mxGraph; 
});

然后您应该能够将其注入您的应用程序,如下所示:

app.controller('yourController', ['$scope', 'mxgraph', function($scope, mxgraph) { ... }]);

推荐阅读