Modify the ztree to be compatible with the ui-sref function of Angular ui-router.

Modify the ztree to be compatible with the ui-sref function of Angular ui-router.

// 1. Add the ui-sref property // default setting of core_setting = {treeId: "", treeObj: null, view :{...}, data: {key: {children: "children", name: "name", title: "", url: "url", uiSref: "ui-sref" }}// 2. Add the ui-sref value, method // 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] ;},}// Add a method to obtain the value of the ui-sref attribute in data. // 3. Modify the label generation method. // 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) {// to use the ui-sref function of angular-ui-router, you must delete the onclick event and href. Html. push ("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, '>'), "'");} html. push (">") ;},}// 4. initialize ztree $ j (). ready (function () {var setting = {}; var zNodes = [{name: "Main Menu", open: true, children: [{name: "menu 1", open: true, children: [{name: "user", "ui-sref": "user" },{ name: "permission", "ui-sref ": "permission" },{ name: "menu", "ui-sref": "menu" },{ name: "others", "ui-sref ": "other"}] },{ name: "menu 2", children: [{name: "user" },{ name: "permission" },{ name: "menu" },{ name: "other"}] },{ name: "menu 3", isParent: true}]; $ j. fn. zTree. init ($ j ("# treeDemo"), setting, zNodes );});

// 5. html code.

// 6. angular js Code. 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: 'Hello {name} 'templateurl: web_root +'/views/menu.html '}). state ('other', {url: '/other', templateUrl: web_root + '/views/other.html'}); $ urlRouterProvider. otherwise ("user") ;}]);