how to reload the dynamic table every 1 second in the controller in angular js?

Question

I'm fetching data from api and populating in the table i need to relaod the table only in every 1 second , i tried using $timeout but im getting error saying -

  $scope.tableParams.reload();//TypeError: Cannot read property 'reload' of undefined

code

    <div align="center">
        <div ng-app="myApp" ng-controller="customersCtrl">
            <table ng-table="tableParams">
                <tr>
                    <td>device id</td>
                    <td>device unique id</td>
                    <td>access status</td>
                    <td>current time</td>
                </tr>
                <tr>
                    <td>{{ access.id }}</td>
                    <td>{{ access.devid }}</td>
                    <td><img ng-src="{{statusValues[access.status]}}" /></td>
                    <td>{{ access.CurrentTime }}</td>
                </tr>
            </table>
        </div>
        </div>



      <script type="text/javascript">
var app = angular.module('myApp', []);
app.controller('customersCtrl', function ($scope, $http, $timeout) {
    $http.get("http://example.com/get")
    $scope.reloadTable = function () {
        $timeout(function () {
            $scope.tableParams.settings().$scope = $scope;
            $scope.tableParams.reload();
            $scope.reloadTable();
        }, 1000)
    };
    $scope.reloadTable();
});
        </script>

sorry im not aware of socket. i new in angular js coding.can u help me out. — Swapna, Jan 25 '17 at 06:16
http://stackoverflow.com/questions/26205534/ng-table-not-rendering-new-data-when-reloading-request — Manikandan Velayutham, Jan 25 '17 at 06:38

score 1 · Answer 1 · answered Jan 25 '17 at 06:47

1

just add the following code line into my code after tableParams instance creation.

$scope.tableParams.settings().$scope = $scope;

answered Jan 25 '17 at 06:47

Ramesh Rajendran

37,412
45
153
234

i have not created instance tableParams, shall i add after this line. $scope.tableParams.reload(); – Swapna Jan 25 '17 at 06:50
`You should add this line before reload the table params.` – Ramesh Rajendran Jan 25 '17 at 06:53
i have updated code as u said still geting reload not defined error.updated the question with code – Swapna Jan 25 '17 at 06:56
try creating a instance and then give a try of the above code, hope it will work – balajivaishnav Jan 25 '17 at 07:05

SivaPrasad Aluri · Accepted Answer · 2017-01-25T07:27:49.317

Hi Your trying to reload the params using reload method, but it seems that reload() method is working with $route concept to update the url, based on params. and insted of $timeout , try with $interval,

I've done some modification here, Plesae take a look and This may helpful

var app = angular.module('myApp', []);
app.controller('customersCtrl', function ($scope, $http, $interval) {
  $scope.fn = function(){
    $http.get("https://jsonplaceholder.typicode.com/posts")
      .then(function(data){
      console.log(data.data)
        $scope.Tdata = data.data;      
    })
    }
        $interval(function () {          
          $scope.fn()
        }, 1000)      
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app='myApp' ng-controller="customersCtrl">
<div align="center">
        <div ng-app="myApp" ng-controller="customersCtrl">
            <table ng-table="tableParams">
                <tr>
                    <td>device id</td>
                    <td>device unique id</td>
                    <td>access status</td>
                    <td>current time</td>
                </tr>
                <tr ng-repeat="d in Tdata">
                    <td>{{ d.id }}</td>
                    <td>{{ d.title }}</td>
                    <td><img ng-src="{{}}" /></td>
                    <td>{{ d.body }}</td>
                </tr>
            </table>
        </div>
        </div>
</div>

hai where u have done modification . im not getting ur modified solution. — Swapna, Jan 25 '17 at 07:25

MGA · Answer 3 · 2017-01-25T07:35:10.530

1

<script type="text/javascript">
        var app = angular.module('myApp', []);
        app.controller('customersCtrl', function ($scope, $http, $timeout, $interval) {
            getData = function(){
                $http.get("http://example.com/get")
                    .success(function(data) {
                        $scope.tableParams.settings().$scope = $scope;
                        $scope.reloadTable();
                    })
                    .error(function(data, status) {
                        console.error(status);
                    })
            }

            $interval(function (){
                getData();
            }, 1000);
</script>

edited Jan 25 '17 at 07:35

answered Jan 25 '17 at 07:26

MGA

511
2
11

can u put in the script tag ? – Swapna Jan 25 '17 at 07:27
can you please put your working code in https://jsfiddle.net/ so we can do edit there as we are just giving you idea to follow not exactly writing your code here. – MGA Jan 25 '17 at 07:39
shared code in jsfiddle https://jsfiddle.net/7kexryjc/1/ getting settings not defined error – Swapna Jan 25 '17 at 07:47

how to reload the dynamic table every 1 second in the controller in angular js?

3 Answers3