I'm totally new to AngularJS. Just wanted to try out relative URLs with $routeProvider.
Here is the scenario:
I have a "Edit" page, the ASP.NET MVC link to the page would be:
http://localhost/Workflow/Edit
So the ASP.NET MVC Controller is "WorkflowController" and the action is "Edit". For the Partials I have Controller actions that each return a Partial View like this:
public ActionResult WorkflowTransition()
{
return PartialView("WorkflowTransition");
}
public ActionResult WorkflowTransitionApprovers()
{
return PartialView("WorkflowTransitionApprovers");
}
Following is the AngularJS module configuration - note: a PartialView (as mentioned above) is called for each of the routes (this could be incorrect):
$routeProvider.when('Workflow/WorkflowTransition', {
templateUrl: '/Workflow/WorkflowTransition',
controller: 'transitionCtrl',
});
$routeProvider.when('Workflow/WorkflowTransitionApprovers', {
templateUrl: '/Workflow/WorkflowTransitionApprovers',
controller: 'approversCtrl'
$routeProvider.otherwise({
redirectTo: '/'
});
Note: I have not specified either of the following:
$locationProvider.html5Mode(false);
OR
$locationProvider.html5Mode(false).hashPrefix('!');
The href links are specified like this:
<a href="#/Workflow/WorkflowTransition">{{workflow.Identifier}}</a>
This generates links of this form:
http://localhost/Workflow/Edit#/Workflow/WorkflowTransition
This is obviously wrong (and clicking the link doesn't do anything probably because the browser tried to navigate to the hash), so I have tried the leading '/', but no luck there too:
<a href="/#/Workflow/WorkflowTransition">{{workflow.Identifier}}</a>
If I navigate the partial directly i.e. http://localhost/Workflow/WorkflowTransition
, the browser renders the html as-is (along with the angularjs curly braces {{}}).
My question is: How does AngularJS treat the '#' or '#!' when it comes to determining relative URLs? For e.g. does this route (assuming I knock off the /Edit part from the URL in the anchor tag):
$routeProvider.when('Workflow/WorkflowTransition',
match the URL:
http://localhost/Workflow/#WorkflowTransition
?
Does it remove the '#' from the URL and then check it against the URL pattern in $routeProvider.when() ?
Can someone please suggest correct routes for the relative URLs?