The MindFusion Forums | |
Flow Diagramming Components >> Html Canvas & JavaScript >> Use Diagramming in Typescript/Angular
https://mindfusion.eu/Forum/YaBB.pl?num=1531413146 Message started by Davaaron on Jul 12th, 2018 at 4:32pm |
Title: Use Diagramming in Typescript/Angular Post by Davaaron on Jul 12th, 2018 at 4:32pm
Hi,
is there anyone who managed to import the 'diagram-library' npm package into an Angular 2+ project? I added diagram-library to package.json and saved the file which caused an automatic restorage of my npm packages in my node_modules folder. The diagram-library folder contains some Javascript files (Common, Diagramming) and a typed file (t.ds). I'd like to take advantage of that typings, that's why I am not including the JavaScript files by the HTML <script> tags. What I did was the following: Code (javascript):
The first line is throwing an error, saying: Quote:
I think the problem is that you are not exporting the declared namespace nor any classes? But I don't know, as I'm pretty new to Angular and Typescript. How can I solve the issue without losing the advantage of type safety on compile time and word suggestions? Thanks in advance :) |
Title: Re: Use Diagramming in Typescript/Angular Post by Lyubo on Jul 13th, 2018 at 11:43am
Hi,
Adding a reference path to the typed diagramming file should be enough to resolve the types in the library: Code (java):
Also, make sure that the MindFusion.Common.js and MindFusion.Diagramming.js scripts are referenced and loaded by the browser. If you're not using jquery, you should also set the MindFusionImpl StandAlone setting: Code (html):
Regards, Lyubo |
Title: Re: Use Diagramming in Typescript/Angular Post by Davaaron on Jul 13th, 2018 at 2:55pm
Hi,
thanks for your quick response. It seems to work now. Every npm package that I have installed yet, could be imported easily by the code shown in the starting post. |
Title: Re: Use Diagramming in Typescript/Angular Post by AK on Oct 23rd, 2018 at 3:31am
I am new in mind fusion, i want to use in Angular 2 , but i am getting below error.
The file ".../jsdiag.t.ds" is not a module my code here: import { MindFusion } from 'diagram-library'; import AnchorPattern = MindFusion.Diagramming.AnchorPattern; import AnchorPoint = MindFusion.Diagramming.AnchorPoint; import DiagramNode = MindFusion.Diagramming.DiagramNode; import DiagramLink = MindFusion.Diagramming.DiagramLink; import ShapeNode = MindFusion.Diagramming.ShapeNode; import MarkStyle = MindFusion.Diagramming.MarkStyle; import Style = MindFusion.Diagramming.Style; import Theme = MindFusion.Diagramming.Theme; import HandlesStyle = MindFusion.Diagramming.HandlesStyle; import Events = MindFusion.Diagramming.Events; import Diagram = MindFusion.Diagramming.Diagram; import Shape = MindFusion.Diagramming.Shape; |
Title: Re: Use Diagramming in Typescript/Angular Post by Lyubo on Oct 23rd, 2018 at 7:24am
Hi,
Did you try the solution, already provided in the thread above? Regards, Lyubo |
Title: Re: Use Diagramming in Typescript/Angular Post by Lyubo on Oct 24th, 2018 at 7:34am
Attached to this post is a minimal sample Angular application, that demonstrates how to add the diagram component.
Regards, Lyubo https://mindfusion.eu/Forum/YaBB.pl?action=downloadfile;file=MinApp.zip ( 95 KB | 151
Downloads )
|
The MindFusion Forums » Powered by YaBB 2.6.11! YaBB Forum Software © 2000-2024. All Rights Reserved. |