Why is the function inside my promise not running

Question

I've heard that $q and promise is great for synchronous programming.

I want my second function to run after my first function which has a timeout. So basically I want mt first function to finish running first before my secondfunction operates

My code is:

<head>
  <link rel="stylesheet" type="text/css" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>
</head>

<body ng-app="myApp">
  <div ng-controller="myCtrl">
      <button ng-click="myClick()">Click Me!</button>
  </div>
  <script type="text/javascript">
     angular.module('myApp', [])
    .controller('myCtrl',['$scope', '$timeout', '$q', function($scope, $timeout, $q){
    $scope.functionOne = function(){
      return $q(function(resolve, reject){
        $timeout(function(){
          alert("dean");
        }, 3000);
      })
    };
    $scope.functionTwo = function(){
      alert("armada");
    }

    $scope.myClick = function(){
      var promise = $scope.functionOne();
      promise.then(function(){
        $scope.functionTwo();
      }, function(){
        alert("fail");
      })
    };
}]);
  </script>
</body>

Plunker: https://plnkr.co/edit/6hJF4mxrCQ17XXA43eUl?p=preview

Cause you don't call `resolve` or `reject`? – Icepickle Aug 23 '16 at 12:40 — Icepickle, Aug 23 '16 at 12:40
Yep, a correct answer has been given – Dean Christian Armada Aug 23 '16 at 12:42 — Dean Christian Armada, Aug 23 '16 at 12:42

score 2 · Accepted Answer · edited May 23 '17 at 10:28

2

The promise is created but never resolved. But you don't need it at all! $timeout already returns a promise:

$scope.functionOne = function(){
  return $timeout(function(){
    alert("dean");
  }, 3000);
};

edited May 23 '17 at 10:28

Community

1
1

answered Aug 23 '16 at 12:43

Bergi

630,263
148
957
1,375

score 1 · Answer 2 · answered Aug 23 '16 at 13:01

1

The better way for doing what do you want (in my opinion) is:

$scope.functionOne = function(){
  var defer = $q.defer();

  $timeout(function(){
      defer.resolve({data:""}); // or defer.reject(data)
  }, 1000);

  return defer.promise;
};

answered Aug 23 '16 at 13:01

gianlucatursi

670
5
19

How does it differ in Bergi's answer? – Dean Christian Armada Aug 23 '16 at 13:13
it depends. `functionOne` of Bergi's answer use the $timeout promise for resolve the promise. in my answer you can remove `$timeout(function(){},1000);` and keep only `defer.resolve({data:""});` and working fine. – gianlucatursi Aug 23 '16 at 13:19

Why is the function inside my promise not running

2 Answers2