Your links within the HTML will need to contain the #, so they'll look like: <a href="#/">Dashboard</a> <a href="#/admin">Admin</a>
On Tuesday, January 27, 2015 at 11:05:54 AM UTC-6, Brian Power 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/" > > 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] > <javascript:>> 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] <javascript:>. >> To post to this group, send email to [email protected] >> <javascript:>. >> 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.
