Asp.net MVC 4 Catch All Routing

0

Я изучал и делал примеры с угловыми и Asp.Net MVC. Я столкнулся с проблемой с уловом по всему маршруту. После добавления уловов всех маршрутов мой браузер продолжал сбой. Если я удаляю catch все, то URL-адрес работает отлично, за исключением обновления страницы с сообщением об ошибке 404. Что я сделал здесь неправильно?

My App and Controller:
var myApp = angular.module('myApp', ['ui.router']);

myApp.config(['$routeProvider','$locationProvider',
    function ($routeProvider, $locationProvider) {
        $routeProvider
        .when('/AddNewOrder', {
            templateUrl: 'templates/AddOrder',
            controller: 'AddOrderController'
        }).when('/ShowOrders', {
            templateUrl: 'templates/ShowOrders',
            controller: 'ShowOrdersController'
        }).otherwise({
            redirectTo: '/ShowOrders'
        });
        $locationProvider.hashPrefix('!').html5Mode(true);
    }
]);

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

myApp.controller('ShowOrdersController', function ($scope) {
    $scope.message = 'This is the show orders controller';
});

это конфигурация маршрута, которую я создал.

  public class RouteConfig
    {
        public static void RegisterRoutes(RouteCollection routes)
        {
            routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

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

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

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

//Индексная страница

    <!DOCTYPE html>
    <html lang="en">
    <head>
     <title>AngularJS Routing example</title>
    </head>
  <body ng-app="myApp">
    <div class="container">
        <div class="row">
        <div class="col-md-3">
            <class="nav">
            <><href="/AddNewOrder"> Add New Order </a></li>
                <><href="/ShowOrders"> Show Order </a></li>
            </ul>
        </div>
        <div class="col-md-9">
            <div ng-view></div>
        </div>
        </div>
    </div>
       <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular.min.js"></script>
  <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular-route.min.js"></script>  

    @*<script src="app.js"></script>*@
      <script src="~/Scripts/myApp.js"></script>
  </body>
</html>
Теги:
asp.net-mvc-4
asp.net-routing
angularjs-routing

1 ответ

0
Лучший ответ

Основная проблема заключалась в использовании ['ui.router'] вместо ['ngRoute']. Я изменил его [ngRoute], и я по-прежнему получал такое же поведение. Однако после очистки кеша и перезагрузки моего браузера я вижу ожидаемое поведение.

<!DOCTYPE html>
<html lang="en" ng-app="myApp" ng-strict-di>
  <head>
    <title>AngularJS Routing example</title>
  </head>

  <body>

    <div class="container">
        <div class="row">
        <div class="col-md-3">
            <ul class="nav">
                <li><a href="/NewOrder"> Add New Order </a></li>
                <li><a href="/ShowOrders/123"> Show Order </a></li>
               <div ng-controller="CalculatorController">
                <li><a href="/Calculator">Calculator</a></li>
              </div>
            </ul>
        </div>
        <div class="col-md-9">
            <div ng-view></div>
        </div>
        </div>
    </div>


   <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular-route.min.js"></script>  
   @*   <script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.10/angular-ui-router.min.js"></script>*@
    @*<script src="app.js"></script>*@
      <script src="~/Scripts/myApp.js"></script>
  </body>


//the new module using ngRoute.

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

Ещё вопросы

Сообщество Overcoder
Наверх
Меню