CODEWITHSUNDEEP
javascriptangularjshtml-table
Fabrizio Bartolomucci
Fabrizio Bartolomucci

Reputation: 4948

Reloading angular table when new data is received

I need to populate an angular table when data from a websocket is received: I tried with:

<div ng-controller="MyCtrl" ng-app="myapp">
        <table ng-table="commentsTable">
            <tr ng-repeat="item in obj track by $index">
            <td class="plantCell">{{item.nome}}: </td>
            <td class="statusCell">{{item.status}}</td>
            <td class="statusCell">{{item.testo}}</td>
        </tr>
        </table>
        </div>
<script>
    var app=angular.module('myapp', []);
    var printOperation;
    function GetFromLocalStorage(key) {
        var items=localStorage.getItem(key);
        console.log(items);
        if (items===null){
            console.log("item null");
            return null;
        } else {
            if (typeof items!= "string") {items = JSON.stringify(items);}
                    return items;
        }
    }
    app.controller('MyCtrl',    
                function ($scope) {
                    $scope.printComments=function (){
                        $scope.obj=GetFromLocalStorage("AllComments");
                        console.log("ricevo evento e ricarico tabella");
                        console.log($scope.obj);
                        //$scope.commentsTable.reload();
                    }

                    console.log("assegno print operation");
                    printOperation=$scope.printComments;
                }
            );  
            var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
            var eventer = window[eventMethod];
            var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message";
            eventer(messageEvent,function(e) {
                console.log("ricevo messaggio");
                printOperation();
            },false);
<script>

Uncaught TypeError: Cannot read property 'reload' of undefined at $scope.printComments ((index):68) at (index):80

Upvotes: 0

Views: 90

Answers (1)

Stanislav Kvitash
Stanislav Kvitash

Reputation: 4622

If you are using ngTable you should inject it into your app module like angular.module("myapp", ["ngTable"]);.

UPDATE: So after discussing the issue and getting more context on this I can assume that the data is modified outside of AngularJS context in event listener so the view doesn't show the updated value, so I assume wrapping printOperation with $applyAsync should help:

printOperation = $scope.$applyAsync($scope.printComments);

Also I think that the logic should be in one place - inside the controller for example, since it will make the code more readable and maintainable.

Upvotes: 1

Related Questions