SPA刷新頁面使用路由，AngularJS

我有SPA，當我使用路由並想刷新頁面時我得到404，因爲它是客戶端路由。SPA刷新頁面使用路由，AngularJS

我該如何處理？

Here is my routing:

app.config(function ($routeProvider, $locationProvider) { 
    $routeProvider 
     // route for the home page 
     .when('/', { 
      templateUrl: 'index.html' 
     }) 
     .when('/category/gifts/', { 
      templateUrl: 'tpl/categories/category-gifts.html', 
      controller: 'giftsCtrl' 
     }) 
     .when('/category/gifts/:id', { 
      templateUrl: 'tpl/categories/category-gifts.html', 
      controller: 'giftsCtrl' 
     }) 

     .otherwise({ redirectTo: '/' }); 

    $locationProvider.html5Mode(true); 
});

例如：http://www.localhost 後，我進入http://www.localhost/category/gifts/並做CTRL + R或按F5鍵，我得到404，我應該怎麼照顧呢？

來源

2014-07-07 IamStalker

問題commes請更新您的RegisterRoutes（如下面/app_Start/RouteConfig.cs修復即：

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

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




     } 
    }

或選項B）如果你沒有任何控制器，你可以在你的Global.asax處理404錯誤只需將Application_Error方法添加到它。

protected void Application_Error(Object sender, EventArgs e) 
     { 
      Exception ex = Server.GetLastError(); 
      HttpException httpException = ex as HttpException; 

      if (ex != null) 
      { 
       int errorCode = httpException.GetHttpCode(); 

       if (errorCode == 404) 
       { 

        Response.Redirect("~/"); 
       } 
      } 
     }

來源

2014-07-07 15:29:24 sylwester

我沒有任何控制器。它給了我這個：匹配的路線不包括「控制器」路線值，這是必需的。 – IamStalker

你的應用的起點是什麼？ – sylwester

默認路由是'url：index.html' – IamStalker

你可以試圖放在＃之間？相反的： http://www.localhost/category/gifts/ 你可以把 http://www.localhost/#/category/gifts/

你可以閱讀有關：從你的MVC RouteConfig Removing the fragment identifier from AngularJS urls (# symbol)

來源

2014-07-07 15:02:19 user3684749

它implemnted，不幫助。 – IamStalker

我會假設OP的整個觀點是他不想在他的URL中輸入醜＃ – Hades

我在配置文件中嘗試此解決方案之前也有此問題。

配置文件

myapp.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) { 

// Specify the three simple routes ('/', '/About', and '/Contact') 
$routeProvider.when('/', { 
    templateUrl: '/Home/Home', 
    controller: 'homeCtrl', 
}); 
$routeProvider.when('/Login', { 
    templateUrl: '/account/Index', 
    controller: 'loginCtrl', 
}); 
$routeProvider.when('/About', { 
    templateUrl: '/Home/About', 
    controller: 'aboutCtrl', 
}); 
$routeProvider.when('/Contact', { 
    templateUrl: '/Home/Contact', 
    controller: 'contactCtrl' 
}); 
$routeProvider.when('/First', { 
    templateUrl: '/account/First', 
    controller: 'firstCtrl' 
}); 
$routeProvider.when('/Fullpage', { 
    templateUrl: '/Home/Fullpage', 
    controller: 'fullpageCtrl' 
}); 
$routeProvider.otherwise({ 
    redirectTo: '/' 
}); 

// Specify HTML5 mode (using the History APIs) or HashBang syntax. 
//$locationProvider.html5Mode({ enabled: true, requireBase: false }); 
$locationProvider.html5Mode(false);}]);

index.cshtml文件

<a class="brand" href="#/">Simple Routing</a> 
     <div class="nav-collapse collapse"> 
      <ul class="nav"> 
       <li class="active"><a href="#/">Home</a></li> 
       <li><a href="/#/About">About</a></li> 
       <li><a href="/#/Contact">Contact</a></li> 
       <li><a href="/#/Login">Login</a></li> 
       <li><a href="/#/First">first</a></li> 
       <li><a href="/#/Fullpage">fullpage</a></li> 
      </ul> 
     </div><!--/.nav-collapse -->

來源

2016-05-13 10:13:07

SPA刷新頁面使用路由，AngularJS

回答

相關問題