current community

your communities

more stack exchange communities

Stack Exchange
tour help
stack overflow careers
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite

First time using Angular JS, I'm using $http.get to return a Json object. When I output the response data, I can see entire JSON object in the console, but I can't access the object or properties. What am I missing here?

    $scope.init = function (value) {
        $scope.productEditorModel.productId = value;
        $scope.loadData($scope.productEditorModel.productId);
    }

    $scope.loadData = function (productId) {
        var responsePromise = $http.get("/Product/GetProductModel", {
            params: { productId: productId }
        });

        responsePromise.success(function (dataFromServer, status, headers, config) {
            console.log(dataFromServer.DataModel);

          });
    };

When I first output the dataFromServer to the console, the object is null and then it becomes populated. Since it's an async call, I should be able to access and set whatever vars inside the success

I would like to be able to directly access the object and property names IE:

    $scope.productModel.productId = dataFromServer.Data.productId

My json looks like this:

  Object{DataModel:Object, IsSuccess: false}

Thanks!

share|improve this question
    
what is it logging out? –  tpie May 24 at 15:33
    
I'm getting this back when I log the dataFromServer......Object{DataModel:Object, IsSuccess: false} Post is updated –  Mike Anderson May 24 at 15:36
    
And what if you log dataFromServer.DataModel? –  tpie May 24 at 15:39
    
First time I log dataFromServer.DataModel it is null, second time it is an object with props like this: Object{ProductId:1,Title:"Product Name"} etc...but when I try to access a prop by name for example dataFromServer.DataModel.Title, I get this error: Cannot read property 'Title' of undefined –  Mike Anderson May 24 at 15:49
    
Where in your code are you trying to access it? You have to wait until the data is populated before you try to access it because otherwise there is nothing but a promise object there –  tpie May 24 at 15:57

1 Answer 1

up vote 1 down vote accepted

The problem is that you are trying to access the data before it comes back. Here is a plunker that demonstrates how to set it up, and how not to.

  //predefine our object that we want to stick our data into
  $scope.myDataObject = {
    productId: 'nothing yet',
    name: 'nothing yet'
  }

  //get the data, and when we have it, assign it to our object, then the DOM will automatically update
  $http.get('test.json')
  .success(function(data) {
    $scope.myDataObject = data
  });

  var y = $http.get('test.json')
  //this throws an error because I am trying to access the productId property of the promise object, which doesn't exist.
  console.log(y.productId);

Here is the demo

share|improve this answer
    
I'll try that out, thanks! I didn't realize I had to mock up an empty data object to bind to. –  Mike Anderson May 24 at 16:17
    
well...you don't HAVE to...but it won't behave very nicely. –  tpie May 24 at 16:21
    
Makes good sense :) I made this plunker using the empty data object, but I'm still getting that undefined error, what I am missing, gotta be something stupid plnkr.co/edit/zlUsTHcjFV6sOWvPFlVK?p=preview –  Mike Anderson May 24 at 17:18
    
plnkr.co/edit/G922Eda7Z9nxZVDsca4A?p=preview A few things - you don't need that Array prefix. Format your json correctly (no semi-colons in a json file). The primary issue though was you weren't accessing your data at the right property. Wrap your returned json data in angular.json(dataFromServer), but it has to be purely JSON or it will throw an error (you should probably run this through a try/catch block) –  tpie May 24 at 17:30
    
Perfect thanks, after adding the try/catch, the undefined error went away. I did reformat the JSON as suggested, but the JSON object still comes back as undefined the first time around...so the try catch handles it well. –  Mike Anderson May 24 at 19:02

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.