$q.all works for the first call only

Not sure why the q.all is not working the 2nd time e.g. the second time it does not wait for all the promises to be resolved.

Please have a look at the example and press the "call services" button. First time it waits until both promises are resolved but if you press the button again it immediately responds, not sure why?

http://plnkr.co/edit/JNJmX1fjsmxrxYuiNHJb?p=preview

 var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope, $q, MyService1, MyService2) {
  $scope.name = 'World';

  $scope.Status1 = 'Waiting';
  $scope.Status2 = 'Waiting';
  $scope.buttonValue = "Call Services";

  $scope.doServices = function() {

    $scope.Status1 = 'Waiting';
    $scope.Status2 = 'Waiting';
    $scope.buttonValue = "Working ...";
    console.log($scope.Status1)

    var promise1 = MyService1.doIt();
    var promise2 = MyService2.doIt();

   $q.all([promise1, promise2]).then(
      function() {
        $scope.Status1 = 'Done';
      },
      function() {
        $scope.Status1 = 'Failed';
      }
    ).finally(function() {
      $scope.Status2 = 'Done waiting';
      $scope.buttonValue = "Call Services";
      //promises = null;
    });

  }

  $scope.callServices = function() {
     $scope.Status1 = 'Waiting';
  $scope.Status2 = 'Waiting';
    $scope.doServices();
  }

  $scope.reset = function() {
    $scope.Status1 = 'Waiting';
    $scope.Status2 = 'Waiting';
  }

});

app.service("MyService1", function($q, $timeout) {

  var deferred = $q.defer();

  this.doIt = function() {
    $timeout(function() {
      console.log("Service 1 called!");
      deferred.resolve("Service 1 done!");
    }, 2000);

    return deferred.promise;
  }
});


app.service("MyService2", function($q, $timeout) {

  var deferred = $q.defer();

  this.doIt = function() {
    $timeout(function() {
      console.log("Service 2 called!");
      deferred.resolve("Service 2 done!");
    }, 5000)

    return deferred.promise;
  }
});