Routing Asp.Net AngularJs

0
votes

I am having a porblem with the ng-view which doesn't want to load. If I press on a link I get the following Url: http://localhost:63024/Home/Index#/routeOne

Code for my controller:

public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View();
    }
    public ActionResult One()
    {
        return View();
    }

    public ActionResult Two()
    {
        return View();
    }

    public ActionResult Three()
    {
        return View();
    }
}

So a very simple Controller.

And the following routing:

var configFunction = function ($routeProvider) {
$routeProvider.
    when('/routeOne', {
        templateUrl: 'Home/one'
    })
    .when('/routeTwo', {
        templateUrl: 'Home/two'
    })
    .when('/routeThree', {
        templateUrl: 'Home/three'
    });
}
configFunction.$inject = ['$routeProvider'];

myApp.config(configFunction);

And the following view:

<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>

<div ng-view></div>
1
c#asp.netangularjsasp.net-mvc
You are mixing Angular routing (client side) with ASP.net routing (server side) - they aren't the same... typically you would use Angular routing to "navigate" to views without involving server routing (Angular will obtain a new view/template via Ajax/XHR) – EdSF
So I should provide only one routing engine, either the Angular routing or the Asp.net routing? – Tom el Safadi
Or can I combine Angular routing with Asp.net routing? – Tom el Safadi
I don't want to say Angular is only for SPA (single page applications), because it is not, however, that is where it shines. I will also not say you can't mix server and client side when using Angular because you can (I do). It depends on what you are trying to accomplish - e.g. the famous "todo app" Angular tutorial could just be one part of your web site, where Angular does all the "todo application" processes/routing in a single "page" via AJAX/XHR (but the "page" itself in is an ASP.net view that a user navigated to from other parts of your web site via ASP.net routing). Hth.... – EdSF

1 Answers

1
votes

have you specified views for those controller actions in the mvc app, and ng-controller / ng-app on the angular side? (posting this as answer as i can't post a comment)