// 一、添加 ui-sref 属性 //default setting of core _setting = { treeId: "", treeObj: null, view: { ... }, data: { key: { children: "children", name: "name", title: "", url: "url", uiSref:"ui-sref" } } } // 二、添加取 ui-sref 值, 方法 //method of operate data data = { getUiSelf:function(setting, node){ var t = setting.data.key.uiSref === "" ? setting.data.key.uiSref : setting.data.key.uiSref; return "" + node[t]; }, } // 在 data 里面添加获取 ui-sref 属性的值方法。 // 三、修改生成 <a/> 标签属性方法。 //method of operate ztree dom view = { makeDOMNodeNameBefore: function(html, setting, node) { var title = data.getNodeTitle(setting, node), url = view.makeNodeUrl(setting, node), fontcss = view.makeNodeFontCss(setting, node), fontStyle = []; for (var f in fontcss) { fontStyle.push(f, ":", fontcss[f], ";"); } // begin ui-sref var ui_sref = data.getUiSelf(setting,node); if(""!=ui_sref && undefined!=ui_sref && null!=ui_sref && "undefined"!=ui_sref){ // 如果要使用 angular-ui-router 的 ui-sref 功能,则必须把 onclick 事件 和 href 删除。 html.push("<a id='", node.tId, consts.id.A,"' ui-sref='",ui_sref, "' class='", consts.className.LEVEL, node.level,"' treeNode", consts.id.A, "' style='", fontStyle.join(''),"'"); } else { html.push("<a id='", node.tId, consts.id.A,"' class='", consts.className.LEVEL, node.level,"' treeNode", consts.id.A," onclick=\"", (node.click || ''), "\" ", ((url != null && url.length > 0) ? "href='" + url + "'" : ""), " target='",view.makeNodeTarget(node),"' style='", fontStyle.join(''), "'"); } // end ui-sref if (tools.apply(setting.view.showTitle, [setting.treeId, node], setting.view.showTitle) && title) {html.push("title='", title.replace(/'/g,"'").replace(/</g,'<').replace(/>/g,'>'),"'");} html.push(">"); }, } // 四、初始化 ztree $j().ready(function(){ var setting = { }; var zNodes =[ { name:"主菜单", open:true, children: [ { name:"菜单1", open:true, children: [ { name:"用户","ui-sref":"user"}, { name:"权限","ui-sref":"permission"}, { name:"菜单","ui-sref":"menu"}, { name:"其它","ui-sref":"other"} ]}, { name:"菜单2", children: [ { name:"用户"}, { name:"权限"}, { name:"菜单"}, { name:"其它"} ]}, { name:"菜单3", isParent:true} ]} ]; $j.fn.zTree.init($j("#treeDemo"), setting, zNodes); });
// 五、html 代码。 <div> <a id="treeDemo" ui-sref="home" class="ztree"></a> </div>
// 六、angular js 代码。 myApp.config(['$stateProvider', '$urlRouterProvider', function ($stateProvider, $urlRouterProvider) { console.log(web_root); $stateProvider .state('user', { url: '/user', templateUrl: web_root+'/views/user.html' }).state('permission', { url: '/permission', templateUrl: web_root+'/views/permission.html' }).state('menu', { url: '/menu', //template: '<h1>Hello {{ name }}</h1>' templateUrl: web_root+'/views/menu.html' }).state('other', { url: '/other', templateUrl: web_root+'/views/other.html' }); $urlRouterProvider.otherwise("user"); } ]);
时间: 2024-10-07 05:59:59