AngularJS datatables refresh after adding new object

Issue

I'm trying to add new user like this :

$scope.users = UserService.query();

UserService.save({}, newUser, function (data) {
    $scope.users.push(data);
});

• It's adding to server (F5 creates wanting result),
• checking with console.log($scope.users) its also added here.

but that does not change the display

otherwise this works well:

UserService.delete({ id: userId }, function (data) {
    ...
    $scope.homeworks.splice(index, 1);
    ...
});

How can i refresh table after array change ?

UPDATE 1:

I tried $scope.$evalAsync and $q

UPDATE 2

I am using The Angular Way, trying this : Changing data with the Angular way

Html:

<table datatable="ng" dt-options="dtOptions" class="table table-striped table-bordered table-hover">
    <thead>...</thead>
    <tbody>
        <tr ng-repeat="user in users">
            <td>{{user.Name}}</td>
            <td>{{user.Surname}}</td>
            <td>{{user.Address}}</td>
            ...
            ...
            ...
            <td class="center">
                <button type="button" class="btn btn-primary btn-circle" ng-click="edituser(user.Id)">
                    <i class="fa fa-list"></i>
                </button>
                <button type="button" class="btn btn-danger btn-circle" ng-click="deleteuser(user.Id)">
                    <i class="fa fa-times"></i>
                </button>
            </td>
        </tr>
    </tbody>
</table>

UPDATE 3:

I solved:

I try to call this function from modal, if I call inside of page its work.

Solution

I solved:

I try to call this function from modal, if I call inside of page its work.

Answered By - Abdullah