I am building an .NET MVC using AngularJS for the front end on Mono.
I have a simple HomeController with a simple return View() that loads the main page of my project.
My main Index.cshtml looks like:
<body ng-controller="AppController"> <ul> <li><a href="/#/routeOne">Route One</a></li> <li><a href="/#/routeTwo">Route Two</a></li> <li><a href="/#/routeThree">Route Three</a></li> </ul> </body> I have my javascript setup as such:
(function () { var app = angular.module('app', ['ngRoute']); app.config(function ($routeProvider) { $routeProvider.when('/routeOne', { templateUrl: 'RoutesDemo/One' }) .when('/routeTwo', { template: 'RoutesDemo/two' }) .when('/routeThree', { template: 'RoutesDemo/three' }); }); //var app = angular.module('app'); app.controller('AppController', function ($scope) { $scope.test = 'Hello World'; }); })(); So at this point my expected behavior is that if I click on the Route One link, the app should invoke the RoutesDemoController's One method, which renders some partial view :`One. It Worked!
but this doesn't happen.
Instead only the link changes but I don't see any activity in the browser or in the network tab.
Did I miss a step?
EDIT:
The main page I am viewing to hit Index.cshtml is localhost:8080
I am able to hit localhost:8080/RoutesDemo/One which does return my partial view.
When I click on my anchor link for Route One, my url is http://localhost:8080/#/routeOne
.html. It still did not route me