改造 ztree 以便于兼容 Angular ui-router 的 ui-sref 功能
来源:互联网 发布:淘宝信誉评级在哪里看 编辑:程序博客网 时间:2024/06/05 04:08
// 一、添加 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 datadata = {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 domview = {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"); } ]);
0 0
- 改造 ztree 以便于兼容 Angular ui-router 的 ui-sref 功能
- angular-ui/ui-router的使用
- Angular-Ui-Router
- Angular路由:ui-router
- Angular ui-router 入门
- Angular-ui-router入门
- angular路由 ui.router
- angular-ui-router
- 【angular】angular-ui-router学习
- angular 路由,ui-router,ocLazyLoad的使用
- 使用angular ui-router的一点感受
- angular的ui-router小demo
- angular+ui-router+layui的使用心得
- Angular的第三方路由:ui-router
- 关于angular的$state.include()方法与ui-sref和ui-sref-active的使用或者关于angular激活状态的判断
- ui-router中的sref还不支持动态绑定
- angular-ui-router页面路由
- angular UI-Router示例一
- sqlite 插入记录注意项
- iOS 学习资料整理
- Bitmap to YUV
- 主机服务规划
- Gabor滤波器学习
- 改造 ztree 以便于兼容 Angular ui-router 的 ui-sref 功能
- [Android] 获取Android设备的唯一识别码|设备号|序号|UUID
- 使用Weka进行数据挖掘
- linux自动创建设备节点
- 字符串处理函数的一些问题
- RadioButton使用注意点
- 计算机概论
- 数据结构课程设计
- 不吃苦,你要青春何用