Question

任何人都可以指出我正确的方向如何在angularJS中为单页应用程序制作“404 - page not found”教程。

或甚至更好地解释如何实现这一目标。

互联网上似乎没有太多关于此的内容。

Answer 1

在使用本地路由器的Angular SPA中，如果找不到路由，它将点击$routeProvider.otherwise()方法，从而为从服务器传送时通常为404'的路由加载视图。

angular.app('application', ['ngRoute'])
    .config(['$routeProvider', function($routeProvider) {

        // If route is not configured go to 404 route
        $routeProvider.otherwise('/404');

        $routeProvider.when('404', { /* route configuration */ });

    });

这里唯一的缺点是URL pushstate也被更改了，但是如果服务器重定向到自定义404，通常会发生这种情况。

Answer 2

我不会将其视为404页面。

在您的SPA（单页应用）中，您可以进行多个API调用，这些调用会独立更新仪表板上的小部件，其中9个成功（200个），1个失败（404），在这种情况下，您不想重定向用户。

正如 David Barker 所说，你有一个 otherwise ，这是一个包罗万象的页面。

app.config(['$routeProvider',
  function($routeProvider) {
    $routeProvider.
      when('/login', {
        templateUrl: 'login.template.html',
        controller: 'LoginController'
      }).
      when('/', {
        templateUrl: 'dashboard.template.html',
        controller: 'DashboardController'
      }).
      otherwise({
        redirectTo: '/'
      });
  }]);

因此，如果用户输入错误的路线然后转到仪表板，唯一的问题是反馈：

1：您需要一个消息服务来反馈实际API 404有错误响应，并且可以使用拦截器，指令和模型进行管理。

2：您可以使用run方法反馈错误消息，并且查找$ routeChangeError的相同指令和模型会添加错误消息

我希望有所帮助。

Angular.JS 404页面单页面应用程序

2 个答案: