Wie kann ich die Struktur einer AngularJS get Anfrage ändern?

Question

Ich habe folgende Zustände als Teil einer AngularJS App:

.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' 
    } 
} 

Die Regler sind verbunden:

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) { 

    }); 
}); 

Die Stufen Liste funktioniert gut, aber die Abfrage in der Phase-Controller versucht http://localhost/apistage/?stageId=43 zugreifen was zu einem 500 (Interner Serverfehler) führt.

Das URL-Format, das ich verwenden muss, ist http://localhost/apistage/43. Wie kann ich die Abfrage anpassen, um diese URL abzurufen?

Answer 1

Dann verwenden Sie nicht params Optionen auf $ http GET-Anfrage. Statt nur einfache String-Verkettung auf URL verwenden, während Anruf

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

Für REST API Service würde ich sehr Sie ngResource($resource) Modul von Winkel zu verwenden empfehlen. Das hat eine gute Fähigkeit, mit Ruheanrufen umzugehen.

Answer 2

Sie sollten nicht zwei Controller verwenden. Verwenden Sie nur einen Controller und verwenden Sie $ routeParams, um den URL-Parameter abzurufen. Hier prüfen Sie nun, ob Parameter vorhanden sind oder nicht und differenzieren Sie Ihre Logik nach Bedarf. Sie können den folgenden Code verwenden: var stageId = $routeParams.stageId; If(stageId) Do something else Do something different