javascript - Angular UI Router: navigation links with sub navs -


i'm attempting create dynamic tree style navigation.

the basic layout like:

     - page 1     -- page 1-1     -- page 1-2     -- page 1-3     - page 2     -- page 2-1     -- page 2-2     -- page 2-3     - page 3     -- page 3-1     -- page 3-2     -- page 3-3

by default see main links:

     - page 1     - page 2     - page 3

then click link , content page , sub links appear:

     - page 1     -- page 1-1     -- page 1-2     -- page 1-3     - page 2     - page 3

when first started working on creating static states each main page , dynamic route sub pages loaded via view:

     .state('page1',{       url: '/page1',       views: {         'page1menu': {           templateurl: 'views/page1.menu.htm',           controller: 'page1menuctrl'         },         'page1content': {           templateurl: 'views/page1.content.htm',           controller: 'page1contentctrl'         }       }     })     ... (repeated page2 , page3)     .state('page1.info',{       url: '/:info',       views: {         'page1menu': {           templateurl: 'views/page1.menu.htm',           controller: 'page1menuctrl'         },         'page1content': {           templateurl: 'views/page1info.content.htm',           controller: 'page1infocontentctrl'         }       }     })

and behaved way wanted not how wanted handle this. imagine having create new set of states every new section potential having hundreds of sections. , if tree goes deeper 1 level?

after attempting build third level became obvious not sustainable setup (at least in terms of efficiency when expanding content).

so changed setup dynamic, meaning every state after first dynamic. in doing cannot figure out how sub links appear when clicking on main link.

if use view before have uniquely named , have no idea how i'd associate without going right having make bunch of static declarations of states/controllers/etc.

i looked trying use ng-class="{active: $state.includes('whatever')}" didn't work no matter how tried it. have feeling because on same level triggering link:

     start state link container       state link       sub links container ng-class     end state link container

i have tried create plunkr illustrate i'm trying can't ever work way works on server.

because of i'm hoping information enough idea across , find method makes work way hoping will.

question 1: how sub navs show when parent or 1 of children active?

question 2: how can set of dynamic states efficiently expanded new , varied (in quantity) levels?

update: more info question 2 idea here create kind of information reference (a wiki without being wiki). topic groups have specific topics under them while others have sub groups before reaching specific topics. example, people group alphabetical list of people technology group broken sub groups transportation or medical. , groups split others land, sea, , air or pharmaceutical , surgical.

in situation this, it's unclear how many levels necessary topics. may idea of using dynamic states top down not work @ all. can see reasons why case question should have been "is possible i'm trying do?" instead of "how".

going bonatoc's suggestion, sounds may better make first tier of states static , each sub tier made dynamic needs be, planning static depth each.

maybe looking nav tree?


Comments

Post a Comment

Popular posts from this blog

powershell Start-Process exit code -1073741502 when used with Credential from a windows service environment -

i'm running strange behavior powershell start-process call. here call: $process = start-process ` "c:\somepath\mybinary.exe" ` -passthru ` -credential $defaultcredential ` -wait ` -workingdirectory "c:\somepath" ` -loaduserprofile if ($process.exitcode -ne 0) { #do } this call return exit code - 1073741502 . after quick search, exit code seems related generic error when program not load required dll (aka. status_dll_init_failed ). when run without -credential $credential program runs correctly. in order isolate problem, manually launched some.exe in prompt target credential , runs smoothly. so problem seems come way start-process cmdlet launch process. i found potential solutions problem tried apply no luck : link , link . would have idea of what's going on here ? edit 1: run proc mon monitoring program activities when launched directly or via powershell script. problem seems occur when loading kernelbase
Read more

twig - Using Twigbridge in a Laravel 5.1 Package -

i'm trying create laravel 5.1 package uses twigbridge instead of .php views. can normal .php views display fine, when try make use of .twig templates i'm met error. possible use twigbridge templates when creating views laravel package or pretty stuck blade , php ? edit 1: loading twig template without extending works. it's when start using {% extends 'file' %} error comes out. i error error loading /virtual/laravel/packages/username/mypackage/src/views/sample.twig: template "templates.master" not defined () in "/virtual/laravel/packages/username/mypackage/src/views/sample.twig" @ line 1. my folders username |_ mypackage |_ src |_ controllers - samplecontroller.php |_ views |_ templates - master.twig - sample.twig twig template sample.twig {% extends 'templates.master' %} {% block content %} {{ parent()
Read more

c# - LINQ join Entities from HashSet's, Join vs Dictionary vs HashSet performance -

i have hashset's each stores t, have written test application compares different relation algorithms can think of, i'm not pleased results getting. does there exist more efficient ways of achieving object relations, once testing? using system; using system.collections.generic; using system.linq; using system.text; using system.threading.tasks; using system.diagnostics; namespace linqtests { class program { static void main(string[] args) { hashset<user> usertable = new hashset<user>(); hashset<userproperty> userpropertytable = new hashset<userproperty>(); #region lets create dummy data. console.writeline("please wait while creating dummy data, can take while..."); console.writeline(""); int rows = 1000000; for(int x = 0; x < rows; x++) { random rnd = new random(); // ad
Read more