Angular directive question


#1

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


#2

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,


#3

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"}
	]}
]

#4

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


#5

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)


#6

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.


#7

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.


#8

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


#9

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



ang_menu.zip (437 KB)


#10

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.


#11

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 …