Upon page load, I am encountering an issue with retrieving and storing JSON data objects in Angular scope for use on my page and in my controller. When attempting to access the value, I receive the error message:
angular.js:11655 ReferenceError: data is not defined
The specific values I am looking to store include:
c_name
max_slots
base_image
In summary, what I require is:
I need these array objects stored as scope variables so that they can be utilized within my HTML code and elsewhere in my JavaScript controller.
Here is a snippet of my JSON data:
{data: Array(1), status: 200, config: {…}, statusText: "OK", headers: ƒ}
config
...
Below is the excerpt from my JavaScript code where I attempt to retrieve the data:
My JavaScript
$scope.GetData = function () {
$http({
url: "http://www.site.co.uk/one/two/getdata",
method: "POST",
date: {},
headers: {'Content-Type': 'application/json'}
}).then(function (response) {
// success
console.log('you have received the data ');
console.log(response);
// $scope.base_image = response.base_image; $scope.c_name = response.c_name;
$scope.c_name = data.c_name;
$scope.max_slots = data.max_slots;
$scope.slot_image = data.slots.base_image;
console.log($scope.c_name);
}, function (response) {
// failed
console.log('failed getting campaigns goo back to log in page.');
console.log(response);
});
};
$scope.GetData();
This results in the following output when logging the data received:
you have received the data
{data: Array(1), status: 200, config: {…}, statusText: "OK", headers: ƒ}
config
...
Additionally, here is a screenshot for reference: