title: Trying to use AngularJS + $http.get to access the Instagram API
body: <p>Can anyone point out any errors? I'm new to basically all of this and I've just been using the angularJS tutorial, and the API and a few other resources to try and piece this all together with not much luck. Ignore the part about hashtag, it doesn't do anything yet. What the code SHOULD do is respond to input in the first input tag. Whatever is typed in there (nameQuery) is concatenated into the string used to access the API, and then I take that information and store it in $scope.userID, then I use the userID to get the userData and the list of images so that I can print them. It's not working though and I've been poring though it for a while and don't really have any leads. Hopefully you more experienced programmers can help me out!</p>
  
  <p>HTML file:</p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html ng-app&gt;
  
      &lt;head&gt;
          &lt;meta charset="utf-8" /&gt;
          &lt;title&gt;Insta-Visualizer&lt;/title&gt;
          &lt;link rel="stylesheet" type="text/css" href="style.css"/&gt;
           &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"&gt;&lt;/script&gt;
           &lt;script src="script.js"&gt;&lt;/script&gt;
  
      &lt;/head&gt;
  
      &lt;body ng-controller="ImageCtrl"&gt;
  
          &lt;div id="wrapper"&gt;
  
              &lt;div id="header"&gt;
              &lt;span class="title"&gt;Instagram Visualizer&lt;/span&gt;
              &lt;/div&gt;
  
              &lt;div id="body"&gt;
  
                  &lt;div class="border"&gt;
  
                      &lt;div id="search1"&gt;
                          Username &lt;input ng-model="nameQuery"&gt;
                      &lt;/div&gt;
  
                      &lt;div id="search2"&gt;
                          Hashtag &lt;input ng-model="hashtagQuery"&gt;
                      &lt;/div&gt;
  
                  &lt;/div&gt;
  
                  &lt;div class="border"&gt;
                      &lt;ul class="images"&gt;
                          &lt;li ng-repeat="picData in imageList"&gt;
                              &lt;img ng-src="{{picData.images.low_resolution}}"/&gt;
                          &lt;/li&gt;
                      &lt;/ul&gt;
                  &lt;/div&gt;
  
              &lt;/div&gt;
  
          &lt;/div&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>script:</p>
  
  <pre><code>var token = '1502600.bcf60cd.2ddf423a61534720beafdae05c4cf26f';
  
  function ImageCtrl($scope, $http){
  
      var searchURL = 'https://api.instagram.com/v1/users/search?q=' + nameQuery
                 + '&amp;access_token=' + token;
  
      $http.get(searchURL).success(function(data) {
          $scope.userID = data.data.id;
      });
  
      var userDataURL = 'https://api.instagram.com/v1/users/' + $scope.userID
                        + '/media/recent/?access_token=' + token;
  
      $http.get(userDataURL).success(function(data) {
          $scope.userData = data;
          $scope.imageList = $scope.userData.data;
      });            
  
  };
  </code></pre>