Question

我在MVC应用程序中使用Angular 4，页面刷新不会重新加载同一页面。我在网上搜索了很多并获得了有用的信息，仍然无法找出根本原因。我的路由配置有问题，如果有人帮忙纠正它，我真的很感激。

项目结构：我在＆＃39;客户端＆＃39;中保留了与角度相关的文件。文件夹，直接位于根目录下。

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title - My ASP.NET Application</title>

    <base href="/client/">

    <link href="~/Content/Site.css" rel="stylesheet" type="text/css" />
    <link href="~/Content/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <script src="~/Scripts/modernizr-2.6.2.js"></script>

    <!-- 1. Load libraries -->
    <!-- Polyfill(s) for older browsers -->
    <script src="~/Scripts/jquery-1.10.2.min.js"></script>
    <script src="~/Scripts/bootstrap.min.js"></script>
enter code here
    <script src="~/node_modules/core-js/client/shim.min.js"></script>
    <script src="~/node_modules/zone.js/dist/zone.js"></script>
    <script src="~/node_modules/systemjs/dist/system.src.js"></script>
    <script src="~/node_modules/systemjs/dist/system.js"></script>
    <script src="~/client/systemjs.config.js"></script>
    <script>

        System.import('main.js').catch(function (err)
        {
            console.error(err);
        });
    </script>
</head>

<rewrite>
  <rules>
    <rule name="Angular Routes" stopProcessing="true">
      <match url=".*"/>
      <conditions logicalGrouping="MatchAll">
        <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true"/>
      <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true"/>
      </conditions>
      <action type="Rewrite" url="/client/"/>
    </rule>
  </rules>
</rewrite>

// app.component.html中的角度路线

const routes: Routes = [

{ path: 'home', component: HomeComponent }, 
{ path: 'login', component: LoginComponent },
{ path: 'register', component: RegisterComponent },
{ path: 'dashboard', component: DashboardComponent, canActivate: [ LoggedInGaurd]  },
{ path: 'search-history', component: SearchHistoryComponent, canActivate: [LoggedInGaurd] },
{ path: '', redirectTo: '/home', pathMatch: 'full' },
{ path: '**', component: LoginComponent }

// RouteConfig.cs

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

        routes.MapRoute(
            name: "Default",
            url: "{controller}/{action}/{id}",
            defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional },
            constraints: new
            {
                serverRoute = new ServerRouteConstraints(url =>
                {
                    return url.PathAndQuery.StartsWith("/Account/",
                        StringComparison.InvariantCultureIgnoreCase);
                })
            }
        );

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

页面刷新在mvc app

0 个答案: