Question

我有一个MVC测试项目，我正在研究是否可以使用角度路由来处理它。

我的意思是，我希望能够为我的应用设置一个目标网页：www.testapp.com

然后当人们登录时我希望MVC将它们路由到testapp.com/Dashboard/#/，然后我希望能够使用ng-view加载带有Angualar的页面，如下所示： testapp.com/Dashboard/#/PageOne，testapp.com/Dashboard/#/PageTwo等

以下是我的尝试： main.js：

angular.module('App', ['ngRoute', 'ngResource']);

angular.module('App').config(function ($routeProvider) {
    $routeProvider
    .when('/Dashboard', {
        templateUrl: 'Dashboard/Index'
    })
    .when('/PageOne', {
        templateUrl: 'Dashboard/PageOne'
    })
});

~/Views/Home/Index.cshtml是我的目标网页，它没有使用角度路由它只有ActionLinks登录和注册

〜/ Views / Dashboard / Index.cshtml是我使用ng-app和ng-view的地方，我有这样的链接：<a href="/#/Dashboard">Dashboard</a>，<a href="/#/PageOne">Page One</a>

问题是当我在加载时转到testapp.com/Dashboard，网址变为testapp.com/Dashboard#/而不是testapp.com/Dashboard/#/

另一个问题是，当我点击我的链接时，它会直接返回主页/索引，而URL就像这样：testapp.com/#/PageOne但是正在显示主页

在我的RouteConfig.cs文件中它只是默认值：

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

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

所以我的问题是我的代码在这里出了什么问题，这使得它的功能不像我想要的那样？我需要添加/更改什么？

谢谢！

Answer 1

所以我发现问题在于我编写链接的方式。一旦我的实际角度应用程序被加载（我在仪表板而不是初始化角度的着陆页）我必须将我的锚标记hrefs从\#\{Route}更改为＆＃39; / Dashboard /＃/ {Route} ＆＃39 ;.这是我更新的角度路线配置：

angular.module('App').config(function ($routeProvider) {
    $routeProvider
    .when('/', {
        templateUrl: 'Index'
    })
    .when('/PageOne', {
        templateUrl: 'PageOne'
    })
});

这完全解决了我的问题所以我现在可以在需要时使用角度路由接管节目，并且在我的应用程序中也有MVC ActionLinks。

希望这有助于其他人！

注意

我没有在MVC RouteConfig.cs中更改任何内容，您可以保留默认值。此外，我不得不摆脱ViewStart，因为这让事情搞得一团糟。

使用ASP MVC进行角度路由

1 个答案: