2014-11-03 117 views
2

我有一個基於ASP.NET項目的angularjs應用程序,它使用html5mode,並且完美地工作,除非我想要傳遞路由參數。Angular routing html5mode ASP.NET

角路由:

$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> 

潰敗本地主機:3849 /賬戶 - 的作品,但本地主機: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 /帳號/ 1就開始尋找所有文件位於localhost:3849 /賬戶,沒有找到他們並返回index.html。 路由同樣的問題,而不是

templateUrl: 'templates/editAccount.html', 

,必須是:

templateUrl: '/templates/editAccount.html', 

回答

1

試試這個(您可能需要調整路徑的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> 
+0

無變化,對不起 – nelly2k 2014-11-03 04:32:03

+0

嗯。該配置應該可以工作。我建議你使用Fiddler來檢查失敗的請求。路由規則可能會返回默認文件(html)而不是您的資源。 – 2014-11-03 04:38:35

+0

更仔細地看,你的網址是如何引用的?相對路徑會改變,並導致您的.js文件404 /重定向到index.html,如果他們沒有正確的根。 – 2014-11-03 04:39:49