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.

I am really new to using AngularJS and Javascript. I need to get the totalResults data from a JSON source that looks like this:

{
 "queries": {
  "request": [
   {
    "totalResults": "51"
   }
  ]
 }
}

Once I get the data, I need it to show up in a list using AngularJS. I have tried really hard using .ajax and .getJSON, but I am unable to get either of them to work, given my complete lack of knowledge on using JavaScript. I really appreciate your help! My AngularJS looks like this:

function MyController($scope){
        $scope.url = "https://www.googleapis.com/customsearch/v1?key=[MYKEY]&cx=[MYSECRETKEY]&q=flowers&alt=json&fields=queries(request(totalResults))";
        $scope.newMessage = "";
        $scope.messages = ["Steve Jobs - 515,000,000 results"]; 

        $scope.add = function(){
            $scope.messages.push($scope.newMessage);
        };
        }
  }

In the HTML part, I have this:

<input type="text" ng-model="newMessage">
    <input type="submit" ng-click="add()" value="Click to find out!">

When the user clicks the button, I want the url to be called and the $scope.newMessage should be the value in totalResults. Thanks for your help!

share|improve this question
    
plnkr.co/edit/nZkYsxLHLvf3SZNiJKic –  Prajoth Jan 24 '13 at 5:10

2 Answers 2

up vote 11 down vote accepted

You can use $http service: Documentation

So you can:

$scope.add = function(){
  $http.get($scope.url).then(function(response) {
            $scope.newMessage = response.data.queries.request.totalResults;
            $scope.messages.push($scope.newMessage);
  });
};
share|improve this answer
1  
I thought that callback receives response object, not the data directly. So perhaps it should be srvResponse.data.queries.request.totalResults? Or am I wrong? –  ŁukaszBachman Jan 22 '13 at 20:44
    
Corrent. I'll edit answer. –  Valentyn Shybanov Jan 22 '13 at 21:26
    
hey, this still isn't working for some reason. I tried adding an alert before the $scope.newMessage = response.data.queries.request.totalResults; part, but it's not getting called :( –  Prajoth Jan 23 '13 at 15:52
    
This is the issue that Google Chrome is showing: TypeError: Cannot call method 'get' of undefined at Object.MyController.$scope.add (file://localhost/Users/Prajoth/Downloads/index%202.html:16:17) at https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.js:6129:19 at https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.js:12496:13 at Object.Scope.$eval (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.js:7770:28) –  Prajoth Jan 23 '13 at 16:39
2  
Can you post Plunker/Fiddle that shows this error? –  Valentyn Shybanov Jan 23 '13 at 18:15

Read a little in $http service provided by AngularJS

here is the hint to the code that you would use

$scope.add = function(){
    $http.get(url).then(function(response){
        queries = response.queries;
        $scope.newMessage = queries.request.totalResults;
    })
}
share|improve this answer

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.