将 camunda dmn 建模器集成到 spring mvc 应用程序与 angular js 前端答案

【问题标题】：Integrate camunda dmn modeler in spring mvc application with angular js front end将 camunda dmn 建模器集成到 spring mvc 应用程序与 angular js 前端
【发布时间】：2016-01-20 09:18:29
【问题描述】：

我在spring(backEnd)、angularjs(frontEnd) 有一个项目

我想在我的项目中使用dmn modeler 来创建decision table 并且创建的决策表（是一个xml 文件）我想保存在服务器上。

我已经使用bower 下载了dmn-js 文件。

我不知道 nodeJS。 如果它需要nodeJs，我无法获得，那么我如何在我的spring 项目中使用它。

我想从我的angularJS controller 调用函数。

openTable 接受 xml input
给我xml（在string）作为output的函数

如果在modelerJS 中发现错误，则在我的 html 中显示。

任何理论解释/有用的链接都会很棒！

【问题讨论】：

对我来说春天是一年中的某个时候（我知道，java 是一个孤岛）所以我不能帮助后端部分，但我可以告诉你不需要 nodejs 来在你的项目中包含 dmn-js。仅当您想自己构建建模器时才需要 Nodejs。
如果我在 index.html 中包含由 bower 下载的 dmn-modeler.js 并尝试使用 new Modeler(options) 在角度控制器中创建 dmn 表，那么它说未定义 Modeler :(

标签： javascript angularjs node.js spring camunda

【解决方案1】：

从我目前的尝试来看，

首先，我同意#zeropaper 在评论中写的不需要nodeJS

如果您查看Here给出的示例

您需要包含 modelerJs 而不是 viewerJs 来创建表。（当然还有其他依赖项，例如 dmn-js css）

在angularJS controller 你可以写类似的东西

        var viewer, DmnModeler, initialTemplate;
        DmnModeler = window.DmnJS;

        initialTemplate = ;//xml input (.dmn file)

        viewer = new DmnModeler({ container: '#canvas' });

        viewer.importXML(initialTemplate, function(err) {

          if (!err) {
            console.log('success!');
          } else {
            console.log('something went wrong:', err);
          }
        });

第一次你可以调用它 viewer.createTemplate(callbackfunction)

下次使用现有的dmn 加载它时，您可以使用importXML，如上所示。

下一点在 xml 中获取 dmn 表，您可以执行以下操作，

viewer.saveXML({ format: true }, function(err, xml) {
    console.log(xml); //here is xml
});

您需要一个 html 元素，例如 <div id='canvas' /> 来呈现视图。

如果我错了，请评论/纠正。

【讨论】：