jquery - Single page app url management -


usually in single page app(spa), have single page have have sidenav menu. in menu, there multiple anchor tags.
those anchor tag's url handled angular/react/sammy js router, , main div refreshed based on returned html controller.
pretty simple, right?
but imagine scenario, user directly access anchor tag url via browser address bar. returned html segment loaded whole page.
is there way handle kind of situation; mean whenever user directly access url, he/she addressed?

edit: may i'm not clear problem statement. let me elaborate bit:

  • suppose page url is: abc.com/dashboard
  • this page got navigation menu , div section class name "main-container"
  • user click link in nav menu , router moved url abc.com/view/listofxyz. so, our "main-container" div loaded response of url abc.com/view/listofxyz
  • now user, directly go abc.com/view/listofxyz url , hit eneter. then, page contain response html of url i.e. nav menu , div gone.


question is, can implement design approach, these 2 works well?

better go angular ui-router instead of sammy js router, of course don't know it. in angular-ui-router, define states , urls using $stateprovider of ui-router. user entered url directly in browser, wil addressed correctly if url defined in state matched.

https://github.com/angular-ui/ui-router/tree/legacy see here more info.

here example,

$stateprovider.state('',{    url: '/',    tempate: 'path/to/.html',    controller: 'controllertohandle' }) .state('home', {    url: '/home',    template: 'path/to/home.html',    controller: 'hmectrl' }) .state('home.list',{  //defines child states dot    url: '/list', //shows url home/list because child state    template: 'path/to/list.html' }) 

use $urlrouterprovider.otherwise('/') if no path matched likewise, user can traverse home list example, www.my-app.com host name. if entered www.my-app.com/home/list url /home/list matched, taken home/list page , if entered wrong url, taken home page because of otherwise method.

if there in react/sammy router, better solution


Comments

Popular posts from this blog

python - How to insert QWidgets in the middle of a Layout? -

python - serve multiple gunicorn django instances under nginx ubuntu -

module - Prestashop displayPaymentReturn hook url -