"It sounds like you have a .NET page serving up your angular SPA app at this url: http://www.blah.com/Office/ <http://www.blah.com/Office/?officeid=52> Index/73/"
Yes , thats correct. http://www.blah.com/Office/ <http://www.blah.com/Office/?officeid=52>Index/73/" is a .net cshtml page with<html ng-app="app">. It then does a *<div data-ng-include="'/app/layout/shell.html'"></div>* shell.html is the angular layout. "Any routes you define within that SPA app are relative to that. So if you have a route define as "/admin" the URL for it would be http://www.blah.com/Office/ <http://www.blah.com/Office/?officeid=52> Index/73/#!/admin" This not happening for me. Are you saying I can have a <a href="/"> dashboard</a> with in my angular layout, and it will know I really want <a href="Office/ <http://www.blah.com/Office/?officeid=52>Index/73/#!/"> dashboard</a> ? I can live with #! in my url for sure. On Tue, Jan 27, 2015 at 4:49 PM, Nicholas Smith <[email protected]> wrote: > It sounds like you have a .NET page serving up your angular SPA app at > this url: > http://www.blah.com/Office/ <http://www.blah.com/Office/?officeid=52> > Index/73/ > > Any routes you define within that SPA app are relative to that. So if you > have a route define as "/admin" the URL for it would be > http://www.blah.com/Office/ <http://www.blah.com/Office/?officeid=52> > Index/73/#!/admin > > The .NET side will get the request for "http://www.blah.com/Office/ > <http://www.blah.com/Office/?officeid=52>Index/73/" and serve up whatever > your .NET code generates for that URL. Presumably contains your html and > javascript for your SPA app. Once the pages loads and angular runs, it > examines the rest of the URL after the #! to determine which route to use. > It will see "http://www.blah.com/Office/ > <http://www.blah.com/Office/?officeid=52>Index/73/#!/admin" and only use > the "/admin" when matching against your route configs. > > Also I see your original post you actually want URLs like: > http://www.blah.com/Office/52/staff > <http://www.blah.com/Office/?officeid=52/staff> > http://www.blah.com/Office/52/budgets > <http://www.blah.com/Office/?officeid=52/budgets> > > If you don't want the #! in your URLs you'll need to look into html5 mode > see https://code.angularjs.org/1.3.9/docs/guide/$location > I don't recommend going that route, it's extra complexity to setup within > your Angular app, and on the .NET side to make it work. If you can live > with having the # in your URLs, I'd stick with that for now. > > > > > > > > On Tuesday, January 27, 2015 at 10:26:36 AM UTC-6, Brian Power wrote: >> >> Thanks for your reply Nicholas. >> >> How can my angular routes stay as they are the same? '/' points to >> http://www.blah.com/ >> <http://www.google.com/url?q=http%3A%2F%2Fwww.blah.com%2FOffice%2FIndex%2F73%2F%23%2F&sa=D&sntz=1&usg=AFQjCNGv33lTp_RF-rWvxxmKJ6hHJAV6EQ> >> and >> '/admin' points to http://www.blah.com/ >> <http://www.google.com/url?q=http%3A%2F%2Fwww.blah.com%2FOffice%2FIndex%2F73%2F%23%2F&sa=D&sntz=1&usg=AFQjCNGv33lTp_RF-rWvxxmKJ6hHJAV6EQ>admin. >> How do I tell angular "You start at /Office/Index/73/#/ >> <http://www.google.com/url?q=http%3A%2F%2Fwww.blah.com%2FOffice%2FIndex%2F73%2F%23%2F&sa=D&sntz=1&usg=AFQjCNGv33lTp_RF-rWvxxmKJ6hHJAV6EQ>" >> rather than '/' ? I think I'm misunderstanding something fundamental here. >> >> >> thanks >> Brian >> >> >> >> On Tuesday, January 27, 2015 at 3:10:09 PM UTC, Nicholas Smith wrote: >>> >>> The routes "/" and "/admin" are relative to the URL serving your angular >>> app. So if your app is at "http://www.blah.com/Office/Index/73/";, then >>> your dashboard would be at "http://www.blah.com/Office/Index/73/#/ >>> <http://www.google.com/url?q=http%3A%2F%2Fwww.blah.com%2FOffice%2FIndex%2F73%2F%23%2F&sa=D&sntz=1&usg=AFQjCNGv33lTp_RF-rWvxxmKJ6hHJAV6EQ>" >>> and your admin screen would be "http://www.blah.com/Office/ >>> Index/73/#/admin". Your routes can stay as-is. As far as getting the >>> "73" value into your angular app there are a few ways to do it. I'm not a >>> .NET developer but I think whatever page or script is building the " >>> http://www.blah.com/Office/Index/73"; page could inject the "73" as a >>> value into your page, something like: >>> >>> <script>var office_id=73;</script> >>> >>> >>> >>> On Tuesday, January 27, 2015 at 6:41:22 AM UTC-6, Brian Power wrote: >>>> >>>> Hi Guys, >>>> >>>> I read the other threads on this,but I'm still confused. >>>> >>>> We are building a web site with .net mvc. We have one complex entity, >>>> lets say it an "Office". An office has staff, resources, budgets etc. >>>> A user can have many offices to manage. We have other areas of the system >>>> already built with just .Net. I have a .net view with a list of >>>> offices. When the user clicks on one they're sent to the spa for that >>>> Office. The request goes to a .net controller called OfficeController. >>>> The Index method takes an Id. I want its view to be an Angular spa. >>>> >>>> My route to the spa is http://www.blah.com/Office/ >>>> <http://www.blah.com/Office/?officeid=52>Index/73/#!/ >>>> >>>> My angular stuff is in a folder called 'app' at the root of the >>>> website. Within the spa I have links to other views of the spa. I want it >>>> to have routes like this. >>>> >>>> http://www.blah.com/Office/52/staff >>>> <http://www.blah.com/Office/?officeid=52/staff> >>>> http://www.blah.com/Office/52/budgets >>>> <http://www.blah.com/Office/?officeid=52/budgets> >>>> >>>> I'm using John Papa's HotTowel demo as a starting point for my spa. In >>>> his routing config. He has this... >>>> >>>> return [ >>>> { >>>> url: '/', >>>> config: { >>>> templateUrl: 'app/dashboard/dashboard.html', >>>> title: 'dashboard', >>>> settings: { >>>> nav: 1, >>>> content: '<i class="fa fa-dashboard"></i> Dashboard' >>>> } >>>> } >>>> }, { >>>> url: '/admin', >>>> config: { >>>> title: 'admin', >>>> templateUrl: app/admin/admin.html', >>>> settings: { >>>> nav: 2, >>>> content: '<i class="fa fa-lock"></i> Admin' >>>> } >>>> } >>>> } >>>> ]; >>>> >>>> >>>> >>>> When I can access these views via the the browser with >>>> http://www.blah.com/Office/ >>>> <http://www.blah.com/Office/?officeid=52>Index/73/#!/ and >>>> http://www.blah.com/Office/ >>>> <http://www.blah.com/Office/?officeid=52>Index/73/#!/Admin . Do I need to >>>> "pass in" something like "Office/ >>>> <http://www.blah.com/Office/?officeid=52>Index/73/#!/" to angular and >>>> build dynamic routes? >>>> >>>> >>>> >>>> Thanks for reading >>>> >>>> Brian >>>> >>>> >>>> >>>> >>>> -- > You received this message because you are subscribed to a topic in the > Google Groups "AngularJS" group. > To unsubscribe from this topic, visit > https://groups.google.com/d/topic/angular/TuLtaVNh40A/unsubscribe. > To unsubscribe from this group and all its topics, send an email to > [email protected]. > To post to this group, send email to [email protected]. > Visit this group at http://groups.google.com/group/angular. > For more options, visit https://groups.google.com/d/optout. > -- You received this message because you are subscribed to the Google Groups "AngularJS" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
