使用angular-ui-router處理404

Question

我有一種方法的服務：

service.getVenueBySlug = function(slug) {
    return $http.get(API + '/venue/' + slug);
};

在我的app.routes.js`中：

.state('app.venue', {
  url: '/venues/:venueSlug',
  templateUrl: '/app/views/venue.html',
  controller: 'VenueController',
  resolve: {
    venue: ['VenueService', '$stateParams', '$state', function (VenueService, $stateParams, $state) {
      return VenueService.getVenueBySlug($stateParams.venueSlug).then(function(res) {
        return res.data;
      }).catch(function(err) {
        $state.go('app.404');
      });
    }]
  }
})

控制器VenueController僅具有：

$scope.venue = venue

一切正常，如果我手動輸入帶有錯誤的站點標記的URL，它將正確重定向到404。

問題是我在控制台中收到一個困擾我的錯誤：

有誰知道如何解決？ 我正在使用angular 1.6.4和angular-ui-router 1.0.6。

Answer 1

如對您的帖子的評論中所述-在解決問題的過程中，您可能應該執行以下操作：return $ q.reject（{redirectTo：app.404}）;

然后在路由器配置中，您將監聽stateChangeErrors：

$rootScope.$on('$stateChangeError',
   function(event, toState, toParams, fromState, fromParams, error) {
      if(error.redirectTo) {
         $state.go(error.redirectTo);
      }
   } 
})

$ q.reject是處理（中斷）當前stateChange所必需的，而stateChangeError則在那里處理該拒絕。

（尚未測試代碼，但我記得在我的一個項目中有類似的解決方案）