Angular directive question

I am putting together Angular directive that looks like this:
alarms.directive(‘dhxGird’,
function(){
return {
link:function(scope, element, attrs){
myMenu = new dhtmlXMenuObject({
parent: $element[0],
icons_path: “commons/imgs/”,
json: “commons/dhxmenu.json”,
skin: “dhx_skyblue”
});
myMenu.attachEvent(“onClick”, function(id, zoneId, cas){
switch(id) {
case “reports”:
if ($state)
$state.go(‘body.reports.fields’);
break;
}
});
}
};
});

I am getting into link function but after executing the following line:

myMenu = new dhtmlXMenuObject({
parent: $element[0],
icons_path: “commons/imgs/”,
json: “commons/dhxmenu.json”,
skin: “dhx_skyblue”
});
its’ not going to the next line but instead goes somewhere in your library code, everything start taking too long, and nothing I can see as a menu. can you please help?

Thanks

Can you share the content of commons/dhxmenu.json. Is it default data from the DHTMLX samples or some custom dataset.

I have checked a similar code with local data, and it behaves correctly,

Here:

[
	{id:"home", text:"Home", items:[
		{id: "new", text: "New", img: "new.gif", imgdis: "new_dis.gif"},
		{id: "file_sep_1", type: "separator"},
		{id: "open", text: "Open", img: "open.gif", imgdis: "open_dis.gif"},
		{id: "save", text: "Save", img: "save.gif", imgdis: "save_dis.gif"},
		{id: "saveAs", text: "Save As...", img: "save_as.gif", imgdis: "save_as_dis.gif", enabled: false},
		{id: "file_sep_2", type: "separator"},
		{id: "print", text: "Print", img: "print.gif", imgdis: "print_dis.gif"},
		{id: "pageSetup", text: "Page Setup", img: "page_setup.gif", imgdis: "page_setup_dis.gif", enabled: "false"},
		{id: "file_sep_3", type: "separator"},
		{id: "close", text: "Close", img: "close.gif", imgdis: "close_dis.gif"}
	]},
	{id: "sep_top_1", type: "separator"},
	{id: "assetStatus", text: "Asset Status", items:[
		{id: "undo", text: "Undo", img: "undo.gif", imgdis: "undo_dis.gif"},
		{id: "redo", text: "Redo", img: "redo.gif", imgdis: "redo_dis.gif"},
		{id: "edit_sep_1", type: "separator"},
		{id: "selectAll", text: "Select All", img: "select_all.gif", imgdis: "select_all_dis.gif"},
		{id: "edit_sep_2", type: "separator"},
		{id: "cut", text: "Cut", img: "cut.gif", imgdis: "cut_dis.gif"},
		{id: "copy", text: "Copy", img: "copy.gif", imgdis: "copy_dis.gif"},
		{id: "paste", text: "Paste", img: "paste.gif", imgdis: "paste_dis.gif"}
	]},
	{id: "annunciatorPanel", text: "Annunciator Panel", items:[
		{id: "about", text: "About...", img: "about.gif", imgdis: "about_dis.gif"},
		{id: "needhelp", text: "Help", img: "help.gif", imgdis: "help_dis.gif"},
		{id: "bugReporting", text: "Bug Reporting", img: "bug_reporting.gif", imgdis: "bug_reporting_dis.gif"}
	]},
	{id: "explorer", text: "Explorer", items:[
		{id: "reports", text: "Reports", img: "help.gif", imgdis: "help_dis.gif"}
	]}
]

My problem was a wrong path to imgs and json file. The execution now is going by but all I see is a horizontal bar.
Here my my basic layout:

controller:
alarms.directive(‘dhxGird’,
function(){
return {
restrict: ‘AEC’,
transclude: true,

 link:function(scope, element, attrs){
   myMenu = new dhtmlXMenuObject({
     parent: element[0],
     icons_path: "/imgs/",
     xml: "dhxmenu.xml",
     skin: "dhx_skyblue"
   });       
 }

};
});

I have placed both dhxmenu.xml and imgs folder into the same folders that my view and controller are. Please help.

Thanks

Unfortunately the issue cannot be reproduced locally
Please, refer to the attached demo. It works well for me.
If the problem still occurs for you please, provide with a similar complete demo, where the problem can be reconstructed locally.
ang_menu.zip (46.7 KB)

I am running your sample by simply double clicking on the new.html or from a web site. Both results are the same - nothing is shown.

Please, try to include the dhtmlx libraries in the attached demo.
Also, you should load your demo from any kind of web-server otherwise the ajax-request for loading data to menu won’t work correctly.

<Please, try to include the dhtmlx libraries in the attached demo.
Are you saying the sample is incomplete?

Please, try to open the attached demo.
It works well for me.



ang_menu.zip (437 KB)

Yes, I have changed a reference to dhtmlx library and the sampe shows data. But my code is not working no matter what I do. I think the problem is with relative paths which is hard to sample.

Let’s say my web is constructed like this:
Physical path “d:\folder1” shown under default Web Site in IIS Manager Console. I think VS did it for me.

inside of “folder1” I have folder2 that I am running my web from and where all the stuff is:
localhost/folder1/folder2/index.html

in folder2 I have dhtmlx folder, so in index.html I am referencing dhtml library like this:

I also have many other things referenced in a similar way. They seems to work …