Javascript 角度ui路由和Asp.net路由不工作

Javascript 角度ui路由和Asp.net路由不工作,javascript,angularjs,asp.net-mvc-4,angularjs-routing,Javascript,Angularjs,Asp.net Mvc 4,Angularjs Routing,我对Angular还比较陌生,我正在尝试用一个参数做一个例子。不带参数的链接可以正常工作,但带参数的链接不起作用。我做错了什么 应用程序和控制器: var myApp = angular.module('myApp', ['ui.router']); myApp.config(['$routeProvider','$locationProvider', '$httpProvider', function ($routeProvider, $locationProvider, $http

我对Angular还比较陌生,我正在尝试用一个参数做一个例子。不带参数的链接可以正常工作,但带参数的链接不起作用。我做错了什么

应用程序和控制器:

var myApp = angular.module('myApp', ['ui.router']);

myApp.config(['$routeProvider','$locationProvider', '$httpProvider',
    function ($routeProvider, $locationProvider, $httpProvider) {
        $locationProvider.hashPrefix('!').html5Mode(true);
        $routeProvider
        .when('/NewOrder', {
            templateUrl: 'templates/NewOrder',
            controller: 'AddOrderController'
        }).when('/ShowOrders/:orderID', {
            templateUrl: function (params) {return '/templates/ShowOrders?orderID=' + params.orderID; },
            controller: 'ShowOrdersController'
        }).otherwise({
            redirectTo: '/ShowOrders'
        });
    }
]);

myApp.controller('AddOrderController', function ($scope) {
    $scope.message = 'This is the add new order controller screen';
});

myApp.controller('ShowOrdersController', function ($scope,$routeParams) {
    $scope.message = 'This is the show orders controller';
    $scope.order_id = $routeParams.orderID;
});
Route.config文件:

  routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

            routes.MapRoute(
            name: "NewOrder",
            url: "templates/NewOrder",
            defaults: new { controller = "Templates", action = "AddOrder" });

            routes.MapRoute(
                name: "ShowOrders",
                url: "templates/ShowOrders/{orderID}",
                defaults: new { controller = "Templates", action = "ShowOrders", orderID = "" });

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

            routes.MapRoute(
             name: "Defaults",
             url: "{*url}",
             defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
         );
html文件:


AngularJS路由示例
@**@
编辑注意-根据Charlietfl下面的评论,这是错误的答案。按堆栈溢出的首选项,我不会删除它,因为有错误的内容有时也可以帮助用户找到答案

你必须原谅,因为做angular+MVC4已经有一年多了。。。我甚至不确定这是否值得作为一个评论的“答案”

但是

我对角度路由的记忆是这样的:它们只根据散列之后发生的事情发生(除非配置设置)

您能花点时间测试一下路线吗:

 /ShowOrders/123#/ShowOrders/123

看看有没有什么变化?同时,我会检查一些旧代码,看看我是否能回忆起角度路由的nit-pickle-y位。

首先,你不应该混淆
角度路由
&
用户界面路由器
,因为你目前正在使用
角度路由
,因此,您应该使用
ngRoute
模块,而不是
ui路由器

var myApp = angular.module('myApp', ['ngRoute'/*, otherDependencies */]);
在使用angular的
1.0.7
版本时,您应该使用最新版本,该版本增加了
$routeParmas
$routerProvider
templateUrl函数中的支持(实际上angular从1.1+开始就增加了此支持)

或者,如果出于某种原因希望继续使用旧版本,则可以在
.config
函数中包含
$routeParams
作为依赖项

.when('/ShowOrders/:orderID', {
     templateUrl: '/templates/ShowOrders?orderID=' + $routeParams.orderID,
     controller: 'ShowOrdersController'
})

所有服务器路由都应该映射回角度入口点,而不是复制它们角度路由中的
HTML5模式
删除散列,使url类似于虚拟服务器目录hanks!我没有注意到-我更新了错误的答案,但决定不删除,因为有一天可能会有人在你关于
html5Mode
的评论中发现价值。注意:也加载ui路由器,但使用配置ngRoute@charlietfl谢谢你的提醒,我已经做了相应的编辑