Angular $apply does not update the view

I have a form, when I submit it, it pushes some object to my array. Beneath that form I have a table that shows all items in that array. I want my table to update automatically (without refreshing the page) when new item pushed.

Submit button:

<button type="submit" class="btn btn-default" ng-click="updateTable()">Pay</button>

In my controller:

  $scope.updateTable = function() {
    setTimeout(function () {
      $scope.$apply();
      $scope.$digest();
    }, 0);
  };

However, it does not work. I tried different approaches like $watch service, but i`ve got the same result.

Table

<div class="row paytable">
  <div class="col-xs-10 col-xs-offset-1">
    
    <table class="table table-hover ">
      <tr>
        <td>Id</td>
        <td>Amount</td>
        <td>Cause</td>
      </tr>
      <tr ng-repeat="item in payments">
        <td></td>
        <td></td>
        <td></td>
      </tr>
    </table>
  </div>
</div>

Controller

app.controller('mainController', [ 'user', '$rootScope', '$scope', 'payment', '$timeout', function(user, $rootScope, $scope, payment, $timeout) {

  user.getUsers();
  user.newUser();
  $rootScope.currentUser = user.currentUser();

  $scope.payments = payment.getPayments();
  $scope.newPayment = payment.newPayment;

  $scope.updateTable = function() {
    setTimeout(function () {
      console.log('apply ------------');
      $scope.$apply();
      $scope.$digest();
    }, 0);

  };

  $scope.showPayMessage = function() {
    console.log('im here');
    $scope.showSM = true;
    $timeout(function() {
      $scope.showSM = false;
    }, 2000);
  };
}]);

payment - my service for array manipulation.