javascript - 切换到 angular-ui-router 会导致 $http 出现 500 错误

Question

我正在开发一个在前端使用 Angular、在后端使用 Scala 的应用程序。

最初，该应用使用 Angular 的默认 $routeProvider。

尝试切换到 angular-ui-router 但是，$http.get 和 $http.post 不再工作(我假设 $http 完全损坏)，而客户端路由仍然按预期工作( View 和 Controller 正确加载)。

这是我的路线，使用$routeProvider:

$routeProvider
.when(
  "/Home", {
    templateUrl: "app/components/home/home.html",
    controller: "HomeController"
  }
)
.when(
  "/Project/:projectId/ActivityReport", {
    templateUrl: "app/components/activity-report/activityReport.html",
    controller: "ActivityReportController"
  }
)
.when(
  "/Project/:projectId/ActivityReport/:id/print", {
    templateUrl: "app/components/activity-report/activityReportPrint.html",
    controller: "ActivityReportController"
  }
)
.when(
  "/Project/:projectId/ActivityReport/:id", {
    templateUrl: "app/components/activity-report/activityReport.html",
    controller: "ActivityReportController"
  }
)
.when(
  "/ProjectOverview", {
    templateUrl: "app/components/project/project.html",
    controller: "ProjectController"
  }
)
.when(
  "/Login", {
    templateUrl: "views/login.html"
  }
)
.when(
  "/404", {
    templateUrl: "app/shared/404.html"
  }
)
.when(
  "", {
    redirectTo: '/Home'
  }
)
.otherwise({redirectTo: 'Home'});

// use the HTML5 History API
$locationProvider.html5Mode({
  enabled: true,
  requireBase: false
});

并使用$stateProvider(请假设templateUrl相同，同时进行了重大重组):

$urlRouterProvider.otherwise('/');

$stateProvider
.state('home', {
  url: '/',
  templateUrl: 'app/components/home/home.html',
  controller: 'HomeController'
})
.state('activity-report', {
  url: '/Project/:projectId/ActivityReport/:id',
  templateUrl: 'app/components/activity-report/activityReport.html',
  controller: 'HomeController'
})
.state('activity-report-print', {
  url: '/Project/:projectId/ActivityReport/:id/print',
  templateUrl: 'app/components/activity-report/activityReportPrint.html',
  controller: 'ActivityReportController'
})
.state('activity-report-new', {
  url: '/Project/:projectId/ActivityReport/',
  templateUrl: 'app/components/activity-report/activityReport.html',
  controller: 'HomeController'
})
.state('project', {
  url: '/ProjectOverview',
  templateUrl: 'app/components/project/project.html',
  controller: 'ProjectController'
})
.state('login', {
  url: '/Login',
  templateUrl: 'views/login.html'
})
.state('404', {
  url: '/404',
  templateUrl: 'app/shared/404.html'
})

// use the HTML5 History API
$locationProvider.html5Mode({
  enabled: true,
  requireBase: false
});

这里是应该获取和发布数据的工厂，在切换到ui-router时完全中断(500服务器错误) :

angular.module('bananas').factory("activityReportFactory", ['$http', 'cacheFactory', function ($http, cacheFactory) {

    var urlBase = '/activity';
    var dataFactory = {};

    dataFactory.getActivityReport = function(id){
        return $http.get(urlBase + '/' + id);
    };

    dataFactory.saveActivityReport = function(activityReport){
        cacheFactory.remove(urlBase);
        cacheFactory.remove(urlBase + 'project/' + activityReport.projectId + '/activities');
        cacheFactory.remove(urlBase + '/' + activityReport.id);


        return $http.post(urlBase, activityReport);
    };

    dataFactory.cancel = function(activityReport){
        cacheFactory.remove(urlBase);
        cacheFactory.remove(urlBase + 'project/' + activityReport.projectId + '/activities');
        cacheFactory.remove(urlBase + '/' + activityReport.id);

        return $http.delete(urlBase + '/' + activityReport.id);
    };

    return dataFactory;
}]);

确切的错误消息:POST http://localhost:9000/activity 500(内部服务器错误)

最后，服务器记录:http://pastebin.com/iiJmAnaW

切换到 ui-router 后，什么可能会破坏应用程序？其他一切保持不变。

编辑:以下是根据要求的响应和请求 header :http://pastebin.com/rYLtVVxY

Answer 1

根据有关切换到 ui-router 的讨论，检查您当前的 Controller 签名...

angular.module('MELon').controller('ActivityReportController', 
    ['$scope', '$http', '$route', '$routeParams', 
    [...]

您可能会以某种方式使用 $route 和 $routeParams，也许会收集一个值以便稍后在 $http 调用中使用。让我们切换到 ui-router 的等效项 - $state 和 $stateParams...

angular.module('MELon').controller('ActivityReportController', 
    ['$scope', '$http', '$state', '$stateParams', 
    [...]

参见$stateParams和 $state供使用