So i've been working on an application using angularjs and symfony. I was trying to retrieve data on a repetitive basis every 5000 ms, so i resorted to "$timeout" feature to get a real-time data retrieval from server.

Here is my controller code :

```
.controller('clientController', [ '$rootScope','$scope', 'Api' , 'toastr',   
'$window', '$routeParams', '$filter'  , '$timeout',
 function($rootScope,$scope, Api  ,toastr, $window, $routeParams, $filter , 
 $timeout) {

     $rootScope.myVar=true;

 $scope.clients = [];
 var  retrieveItems = function () {

 Api.getAllClients()
  .then(function (result) {
    console.log('result', result);
    $scope.clients = result.data;
    $timeout(retrieveItems, 5000);
  }, function (error) {
    console.log('error', error);
  });
  };

 ...

}])

```

Here 's the vue code :

```
 <table class="table table-striped table-bordered" id="editable-datatable">
                           <thead>
                                <tr>
                                    <th>Username</th>
                                    <th>Email</th>
                                     <th>tel</th>
                                     <th>Actions</th>

                                </tr>
                            </thead>
                            <tbody>
                                <tr ng-repeat="client in clients" id="1" class="gradeX">
                                    <td>{{client.username}}</td>
                                    <td>{{client.email}}</td>
                                   <td>{{client.tel}}</td>

                                     <td  collapse=3>

                                                 <a style="border: 1px solid rgba(10, 6, 6, 0.25); padding: 4px;" ng-href="#!/client/{{client.id}}" ng-click="ClientDetailsController()">
                                                   <i class="icon-eye-open"></i> Details 
         </a> &nbsp;&nbsp;

<span style="margin-left: 10px"><a  data-toggle="modal" href  data 
target="#exampleModal" ng-click="setID(client.id)" >
                       <i class="icon-remove-sign"></i> Delete
                                                  </a></span>

                                        </td>

                                </tr>

                            </tbody>

                        </table>

```

My problem is that whenever i remove the "retrieveItems" function everything works just fine. I get all the clients but when to add the timeout service so i can refresh the registered clients every 5 seconds... The clients won't load on the vue but no errors in the error section. Would someone please enlighten me to what exactly the problem might be ..any other suggestions to make real time retrieval functional. Thanks in advance .