Joe82 Joe82 - 5 months ago 12
AngularJS Question

Angular JS - Error with http request with nested scopes

This question is based in this previous answer.

I am trying to send an http request where one of the elements I want to send is expressed in the view as

{{selectedCountry.shipping[shippingType]}}


The request has to go along other element so in order to make a single request I mix them together with

$scope.checkoutData = angular.extend($scope.selectedCountry.shipping[$scope.shippingType], $scope.selectedCountry.name);


And then send the request with

$scope.submitForm = function() {
$http.post('process.php', $scope.checkoutData)
};


But when doing the second step I get an error. You can see the working fiddle here (with the second step commented, so it doesn't break the code). Thanks in advance!

Answer

You need to inject $http to your controller:

app.controller('myCtrl', function($scope, $http) {
 ...
})

The error i see in your plunker is :

ReferenceError: $http is not defined

For your second issue with angular.extend, try changing your submit function to:

$scope.submitForm = function() {
    var checkoutData = {
        shippingAmount: $scope.selectedCountry.shipping[$scope.shippingType],
        country: $scope.selectedCountry.name
     }

    $http.post('process.php', checkoutData)
};
Comments