带有 AngularJS 路由的 ASP.NET 5 路由

Question

我正在使用带有 AngularJS 的 ASP.NET 5 开发应用程序。我正在使用 Angular 提供的基本客户端 HTML 路由支持。我已经成功实现了Angular Routing，Startup类中的默认路由是

app.UseMvc(routes => 
        {
            routes.MapRoute(
                name: "default",
                template: "{controller=Home}/{action=Index}/{id?}");
        });

这是我的 Angular 路由

app.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) {
$routeProvider.
    when('/', {
        templateUrl: 'static/home.html',
        controller: 'AppController'
    }).
    when('/about', {
        templateUrl: 'static/about.html',
        controller: 'AppController'
    }).
    when('/contact', {
        templateUrl: 'static/contact.html',
        controller: 'AppController'
    }).
    when('/tutorial', {
        templateUrl: 'static/tutorial.html',
        controller: 'AppController'
    }).
    otherwise({
        redirectTo: '/'
    });

    $locationProvider.html5Mode(true);
 }]);

一切正常，但是当我在同一个控制器中创建另一个操作并希望通过 URL 重定向到该操作时，它会将其重定向到相同的操作，即索引

这是我的 HomeController 代码

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

    public IActionResult Web()
    {
        return View();
    }
}

路由发生在索引中，但无法导航到 Web 操作。我面临的问题是什么。谢谢。

Answer 1

我认为问题在于您的应用程序对您的Web 方法一无所知。要解决这个问题，您可以：

1) 使用属性路由，并且

2) 在你的路由配置方法中写直接路由。

同时检查您的 web.config 文件是否在 system.webServer 部分的 rewrite 节点或任何其他重定向配置中进行重定向

附：请注意，如果您重定向到另一个页面，您的 Angular 应用程序将重新配置并重新启动。这需要一些时间。如果您希望您的应用程序真的很酷，则不应使用重定向和所有其他页面重新加载方法。尝试以“角度”的方式思考。如果您想更改部分主要内容 - 角度将通过路由来完成。如果你想加载一些额外的内容并且你希望它在浏览器中看起来像 http://host/controller/method/submethod1/submethod2 url - Angular 也可以为你做。作为第一步，您只需将get() 方法放在角度控制器中。在这种情况下，当 Angular 将解析此控制器时，它会调用您的 get() 方法并从服务器加载数据。因此，您将始终快速应用实际内容。

附言尝试使用angular-ui-routing 而不是默认的ng-route。 ng-route 不错，但不能很好地支持子路由，还有一些其他的问题。 angular-ui-routing 解决了所有这些乱七八糟的事情

Answer 2

试试这个来注册你的路线，

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

Answer 3

试试这个：

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

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

然后在你的配置下面试试这个：

   .controller('RootController', ['$rootScope', '$scope', '$route', '$routeParams', '$location', '$http',
    function ($rootScope, $scope, $route, $routeParams, $location, $http) {

        $scope.$on('$routeChangeSuccess', function (e, current, previous) {
            $scope.activeViewPath = $location.path();
        });

    }]);

希望这会有所帮助。 =)