In ngTables, running $scope.tableParams.reload() for the third time results in TypeError: Cannot set property '$data' of null

Adam picture Adam · Apr 29, 2014 · Viewed 8.5k times · Source

This error is in regards to the ngTable plugin for AngularJS.

I seem to be having a really weird error. Basically, I can run $scope.tableParams.reload() twice with no problem, but on the third execution, and every following one, I get the following error:

TypeError: Cannot set property '$data' of null at [removed]/ng-table.js:411:55

I believe this is all the relevant code, but if anything is missing let me know:

$scope.lookupAddress = function(address){       
    var url = 'https://blockchain.info/multiaddr?cors=true&active='+address;
    $scope.loading = true;
    $scope.clearTableData();
    $http.get(url).success(function(data){
        $scope.loading = false;
        $scope.loaded = true;
        $scope.loadError = false;
        glob = data;

        //I believe the next few for loops, and the assignment of transactions, is not relevant to finding the code.  That being said, I've included it because bugs hide where you least expect it.
        for (i = data.txs.length -1; i > -1; i-- ){
            var inputAddr = []; 
            for (z = 0; z < data.txs[i]['inputs'].length; z++){
                inputAddr.push(data.txs[i]['inputs'][z]['prev_out']['addr'])
            }
            var outputAddr = [];
            for (z = 0; z < data.txs[i]['out'].length; z++){
                outputAddr.push(data.txs[i]['out'][z]['addr'])
            }
            transactions[i] = {
                'Hash' : data.txs[i]['hash'],
                'Amount' : data.txs[i]['result'] / 100000000,
                'Balance' : data.txs[i]['balance'] / 100000000,
                'InputAddress' : inputAddr,
                'OutputAddress' : outputAddr,
                'Date' : timeConverter(data.txs[i]['time'])
            };
        };

        //You can also ignore this too... probably.
        $scope.output = {
            'BTC' : data.wallet.final_balance / 100000000, //Response in satoshi, so have to divide.
            'Address' : address,
            'Total Received': data.addresses[0].total_received / 100000000,
            'Total Sent': data.addresses[0].total_sent / 100000000,
            'Transactions' : transactions
        };
        //Enables new data to be loaded, e.g. on a new address.
        if ($scope.tableParams){
            $scope.tableParams.reload();
        } 
        data = transactions;
        $scope.tableParams = new ngTableParams({
            page: 1,            
            count: 5,           // items per page
            sorting: {
                Date: 'desc' 
            }
        }, {
            total: transactions.length, 
            getData: function($defer, params) {
                data = transactions;
                var orderedData = params.sorting() ? $filter('orderBy')(data, params.orderBy()) : data;
                $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));

            }
        });
    }).
    error(function(data){
        $scope.loadError = true;
    });
}

$scope.clearTableData = function(){
    transactions = [];
    $scope.output = {}
    if ($scope.tableParams){
            $scope.tableParams.reload();
    } 
}

Answer

Hasitha Guruge picture Hasitha Guruge · Sep 6, 2014

I know this is too late, but I thought better to comment on this for others who seeking for a answer for the same issue.

I also had the same issue and managed to fix by following the example in following URL.

https://github.com/esvit/ng-table/blob/master/src/scripts/04-controller.js

I just added the following code line into my code after 'ngTableParams' instance creation.

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