角度路由html5mode ASP.NET

Angular routing html5mode ASP.NET

本文关键字:ASP NET html5mode 路由      更新时间:2023-09-26

我有一个angularjs应用程序,它基于ASP.NET项目,使用html5mode,工作非常好,除非我想要传递路由参数。

角度路由:

 $locationProvider.html5Mode(true);
 $routeProvider.when('/accounts', {
            templateUrl: 'templates/accounts.html',
            controller: 'accountsCtrl',
            title: 'Accounts',
            resolve: {
                accounts: function (accountData) {
                    return accountData.getAll();
                }
            }
        });
        $routeProvider.when('/account/:accId', {
            templateUrl: 'templates/editAccount.html',
            controller: 'editAccountCtrl',
            title: 'Account',
            resolve: {
                account: function ($route, accountData) {
                    return accountData.get($route.current.pathParams.accId);
                }
            }
        });

web.config:

<system.webServer>
    <rewrite>
      <rules>
        <rule name="Imported Rule 1" stopProcessing="true">
          <match url="^index'.html" ignoreCase="false" />
          <action type="None" />
        </rule>
        <rule name="Imported Rule 2" stopProcessing="true">
          <match url="." ignoreCase="false" />
          <conditions>
            <add input="{REQUEST_FILENAME}" matchType="IsFile" ignoreCase="false" negate="true" />
            <add input="{REQUEST_FILENAME}" matchType="IsDirectory" ignoreCase="false" negate="true" />
          </conditions>
          <action type="Rewrite" url="/index.html" />
        </rule>
      </rules>
    </rewrite>
  </system.webServer>

Rout localhost:3849/accounts-有效,但localhost:3849/1破坏了系统,看起来无法加载*.js库或任何其他资源。

控制台显示

Uncaught SyntaxError: Unexpected token <

每一个图书馆。怎么了?感谢

更新问题是脚本如何在index.html中引用。原件为:

<script type="text/javascript" src="Scripts/angular.min.js"></script>

必须是:

<script type="text/javascript" src="/Scripts/angular.min.js"></script>

所以当我要求服务器转到localhost:3849/account/1时,它开始在localhost:3849/1account上查找所有文件,但没有找到它们,并返回index.html。路由中的相同问题,而不是

templateUrl: 'templates/editAccount.html',

必须是:

templateUrl: '/templates/editAccount.html',

试试这个(你可能需要调整到index.html的路径):

<?xml version="1.0" encoding="utf-8"?>
<!--
  For more information on how to configure your ASP.NET application, please visit
  http://go.microsoft.com/fwlink/?LinkId=301880
  -->
<configuration>
  <system.webServer>
  <rewrite>
    <rules>
      <rule name="AngularJS" 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="../index.html" />
      </rule>
    </rules>
  </rewrite>
</system.webServer>

</configuration>