如何更改 AngularJS get 请求的结构？

Question

作为 AngularJS 应用程序的一部分，我有以下状态：

.state('app.stages', {
      url: '/stages',
      views: {
        'menuContent': {
      templateUrl: 'templates/stages.html',
      controller: 'StagesCtrl'
    }
  }
})

.state('app.stage', {
url: '/stages/:stageId',
views: {
  'menuContent': {
    templateUrl: 'templates/stage.html',
    controller: 'StageCtrl'
  }
}

关联的控制器是：

controller('StagesCtrl', function($scope,$http) {
$http.get("http://localhost/apistages")
.then(function(response) {
    $scope.stages = response.data;
});
})

.controller('StageCtrl', function($scope, $http, $stateParams) {

  $http({
    method: 'GET',
    url: 'http://localhost/apistage/',
    params: {stageId: $stateParams.stageId}
 }).then(function successCallback(response) {
    $scope.stage = response.data;
 }, function errorCallback(response) {

  });
});

阶段列表运行良好，但阶段控制器中的查询试图访问 http://localhost/apistage/?stageId=43，这导致 500（内部服务器错误）。

我需要使用的 URL 格式是 http://localhost/apistage/43 。我如何调整查询以获取 URL?

Answer 1

然后不要在 $http GET 请求上使用 params 选项。相反，只需在 URL 上使用简单的字符串连接，同时调用服务

$http({
    method: 'GET',
    url: 'http://localhost/apistage/'+$stateParams.stageId //append state parameter in URL itself
})

对于 REST API，我强烈建议您使用 angular 的 ngResource($resource) 模块。具有很好的处理休息电话的能力。

Answer 2

你不应该使用两个控制器。只使用一个controller，使用$routeParams获取url参数。现在在这里检查参数是否存在，并根据需要区分您的逻辑。您可以使用以下代码： var stageId = $routeParams.stageId; If(stageId) Do something else Do something different

如何更改 AngularJS get 请求的结构？

How can I change the structure of an AngularJS get request?

javascript

angularjs

asynchronous

angularjs-http