Angular JS custom service success callback not working

Question

Trying out a basic example of Angular JS.

Created a index.html file and including the main.html file - controller MainController and using the service - service1.

The data grid population is written in the success callback (onCallComplete) of the service1, which is not called for some reason.

Neither its showing any error.

Where am I going wrong?

Link to my code

Answer 1

change your onCallComplete from

var onCallComplete = function(data) {
          $scope.user = data;
          service1.getRepos($scope.user).then(onReposComplete, onError);
        };

to

function onCallComplete(data) {
          console.log(data);
          $scope.user = data;
          service1.getRepos($scope.user).then(onReposComplete, onError);
        }

Here is the working plunker

or move your service1.getUser($scope.username).then(onCallComplete,onError); beneath onCallComplete like given below.

  var onCallComplete = function(data) {
          $scope.user = data;
          service1.getRepos($scope.user).then(onReposComplete, onError);
        };
    service1.getUser($scope.username).then(onCallComplete,onError);

The Reason is When you define your function as var onCallComplete =function(data) the function definition happens at runtime. but using function onCallComplete(data) the function gets defined while parsing the script.So it would be available at any point during runtime.