AngularJS + ASP.NET MVC - Can you use both under “/”?

You could set the $window.location directly from otherwise:

myApp
    .config(function($routeProvider, $locationProvider) {
        $routeProvider
            .when("/", {
                template: "<h1>Welcome!</h1>"
            })
            .otherwise({
                template: " ",
                controller: function($location, $window) {
                    $window.location.href = $location.path();
                    return false;
                }
            });
        $locationProvider.html5Mode(true);
    });

This may not be exactly what you're looking for, but this is now I'm doing it and it's working pretty well.

Note in the .config that I'm doing html5Mode(false). That keeps the URL on the same page and adds a /# that keeps the MVC router from taking over. That also means that you need to add that /# in your links to ensure you can bookmark the page and get back to it (pass through server side routing).

Also, due to the way the MVC router hordes pages and restricts access to CSHTML files, I am using a server side method to get the html partial views. Some of these views use HTML Helpers, so I left them as CSHTML files instead of putting them in an unrestricted static views bin.

MVC Routing

        routes.MapRoute(
            name: "Direct",
            url: "{action}/{id}",
            defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
        );

        routes.MapRoute(
            name: "Default",
            url: "{controller}/{action}/{id}",
            defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
        );

-- Method in Home (or base) Controller

    public PartialViewResult GetPartial(string p)
    {
        return PartialView(string.Format("~/Views/Home/Partials/{0}.cshtml", p));
    }

-- Angular Code

app.config(function ($routeProvider, $locationProvider) {
    $locationProvider.html5Mode(false);

    $routeProvider
        .when("/", { templateUrl: "/GetPartial?p=Dashboard", controller: "DashboardController" })
        .when("/NewWidget/", { templateUrl: "/GetPartial?p=NewWidget", controller: "NewWidgetController" })
        .when("/Widget/:widgetId", { templateUrl: "/GetPartial?p=Widget", controller: "WidgetController" })
        .when("/Widget/Edit/:widgetId", { templateUrl: "/GetPartial?p=WidgetEdit", controller: "EditWidgetController" })
        .otherwise({ redirectTo: "/" });

});

app.controller('DashboardController', function ($scope, $http, $timeout, $q, $sce, $location, $routeParams) {

    $scope.SetPath = function (route) {
            if (!route) return;

            route = route.replace('/#', '');

            if (route[0] == '/')
                $location.path(route);
            else
                $location.path('/' + route);
        };
});

-- HTML

Option A)

<a ng-click="SetPath('/Widget?widgetId=w1234')">View Widget 1234</a>

Option B)

<a href="/#/Widget?widgetId=w1234">View Widget 1234</a>