This is a module for using js-sequence-diagrams on AngularJS.
// app.jsvarapp=angular.module("app",["atSequenceDiagram"]);// using provider.app.config(["sequenceDiagramProvider","$sceProvider",function(sequenceProvider,$sceProvider){// set common option.sequenceProvider.option({theme: "hand"});// enable language-sequence directive.sequenceProvider.enableLanguageDirective();}]);// using on controller.app.controller("ctrl",["$scope","sequenceDiagram","$sce",function($scope,sequence,$sce){$scope.svg=$sce.trustAsHtml(sequence.render("A->B: Does something"));}])<!doctype html><htmlng-app="app"><head><scriptsrc="bower_components/underscore/underscore-min.js"></script><scriptsrc="bower_components/raphael/raphael-min.js"></script><scriptsrc="bower_components/js-sequence-diagrams/build/sequence-diagram-min.js"></script><scriptsrc="bower_components/angular/angular.js"></script><scriptsrc="angular-sequence-diagram.js"></script><scriptsrc="app.js"></script></head><body><!-- using on controller. --><divng-controller="ctrl"><divng-bind-html="svg"></div></div><!-- using directive by element. --><sequence-diagram>
A->B: E
A->B: Does something
</sequence-diagram><!-- using directive by attribute. --><divsequence-diagram>
A->B: A
</div><!-- using directive by attribute with value. --><divng-init="code='a->b: does something'" sequence-diagram="{{code}}"></div><!-- using directive by class "language-sequence". --><pre><codeclass="language-sequence">
A->B: C
A->B: Does something
</code></pre></body></html>