Angularjs : can't recognize ngTable in Controller

Question

I am developing a web application by using angularjs as front end. I am using ngTable for my table design. In my index.html, I add the following code.

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script type="text/javascript" src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<link rel="stylesheet"; href="https://unpkg.com/[email protected]/bundles/ng-table.min.css">
<script src="https://unpkg.com/[email protected]/bundles/ng-table.min.js"></script>

Next, I add ngTable into my app.js

angular.module('AssetManagementApp', ['ngRoute','angularMoment', 'ngTable'])

But when I add ngTable into controller.js. The following is my code.

angular.module('AssetManagementApp')

.controller('PCAssetManagementController', ['$scope', '$http', function($scope, $http){
        $scope.softwareTable = new ngTableParams({
            page: 1,
            count: 10
        }, {
            total: $scope.users.length, 
            getData: function ($defer, params) {
                $scope.data = $scope.users.slice((params.page() - 1) * params.count(), params.page() * params.count());
                $defer.resolve($scope.data);
            }
        });

    }])

The web application crash when I inject 'ngTable' into controller. If I remove ngTable in controller.js. The application back to normal. However, the application still works well when the 'ngTable' is injected into app.js.

Alex Florin · Accepted Answer · 2017-04-05 10:42:06Z

1

You also have to inject the ngTableParams into your controller:

angular.module('AssetManagementApp').controller('PCAssetManagementController', ['$scope', '$http', 'NgTableParams', function($scope, $http, NgTableParams){
    $scope.softwareTable = new NgTableParams({
        page: 1,
        count: 10
    }, {
        total: $scope.users.length, 
        getData: function ($defer, params) {
            $scope.data = $scope.users.slice((params.page() - 1) * params.count(), params.page() * params.count());
            $defer.resolve($scope.data);
        }
    });

}])

edited Apr 5, 2017 at 10:42

answered Apr 5, 2017 at 10:17

Alex Florin

4315 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Chan Yoong Hon Over a year ago

Even I add ngTableParams into .controller('PCAssetManagementController', ['$scope', '$http', 'ngTableParams', function($scope, $http, ngTableParams). It still have the same problem.

Alex Florin Over a year ago

Sorry, it was with a capital N: NgTableParams. I have updated the answer.

Chan Yoong Hon Over a year ago

Still have the same problem. The main problem is the program can't recognize ngTableParams' for controller injection.

Alex Florin Over a year ago

Here is working example of ngTable usage.

Collectives™ on Stack Overflow

Angularjs : can't recognize ngTable in Controller

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related