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

回答

相关问题