title: Calling get request on init
body: <p>This is my controller page</p>
  
  <pre><code>.controller('ActorController',function($scope,$q,$http) {
  
     $scope.showActors = false;
     var POPULAR_PERSON = 'person/popular';
  
      var actors = [];
      for(var i=1;i&lt;=10;i++){
          actors.push($http.get(URL + POPULAR_PERSON + APIKEY + PAGE + i))
      }
      $q.all(actors).then(
          function (response) {
              $scope.actors = response[0].data.results;
              $scope.showActors = true;
  
              for(var j = 1; j &lt; response.length; j++) {
                  $scope.actors = $scope.actors.concat(response[j].data.results);
              }
          },
          function(response) {
              $scope.message = "Error: "+response.status + " " + response.statusText;
          }
      )
  
      $scope.getActorDetails = function(id){
          var actorDetails = $http.get(URL + "person/" + id + APIKEY);
          actorDetails.then(
              function(response){
                  console.log(response.data.biography);
                  $scope.actorDetails = response.data.biography;
              }
          )
      }
  })
  </code></pre>
  
  <p>Both the get request is working properly. This controller gets the actor information and the function getActorDetails() gets the biography of the particular actor using the id.</p>
  
  <p>This is my HTML page</p>
  
  <pre><code>&lt;div ng-controller="ActorController"&gt;
  &lt;div class="actors-list row-content"&gt;
      &lt;div class="col-xs-12" ng-if="!showActors"&gt;
          &lt;h1&gt;{{message}}&lt;/h1&gt;
      &lt;/div&gt;
  &lt;ul class="actors-list media-list"&gt;
      &lt;li class="media" dir-paginate="actor in actors | itemsPerPage:5"&gt;
          &lt;div class="col-sm-2"&gt;
              &lt;div class="media-left media-middle"&gt;
                  &lt;a&gt;
                      &lt;img class="media-object img-responsive"
                           ng-src="http://image.tmdb.org/t/p/w500{{actor.profile_path}}" width=180 height=300 alt="{{actor.name}}"&gt;
                  &lt;/a&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="col-sm-10"&gt;
              &lt;div class="media-body"&gt;
                  &lt;h2 class="media-heading"&gt;&lt;a class="movie-title"&gt;{{actor.name}}&lt;/a&gt;&lt;/h2&gt;
  &lt;span&gt; TO BE INSERTED &lt;span&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/li&gt;
  
      &lt;dir-pagination-controls
              max-size="10"
              direction-links="true"
              boundary-links="true"&gt;
      &lt;/dir-pagination-controls&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>
  </p>
  
  <p>How to insert the function getActorDetails() in the "TO BE INSERTED" so that I can get the actor details of the particular actor.</p>
  
  <p>P.S : function to be passed getActorDetails(actor.id). The function should get called as soon as the page loads. How to call a function without clicking any buttons. </p>