I want to create seperate module for pagination, because I will need it to reuse in different modules, but I don't know how to call a function from module dependency (another module)
Here is my main module:
var App = angular.module('search', ['pagination']);
App.controller('MainController', ['$scope', '$pagination' function($scope, $pagination) {
$scope.testFunction(); //function from pagination module controller
}])
Here is my pagination module:
var App = angular.module('pagination', []);
App.controller('PaginationController', ['$scope', function($scope) {
$scope.testFunction = function(){
console.log("pagination module");
}
}])
I get error:
Error: [$injector:unpr] Unknown provider: $paginationProvider <- $pagination
To share resources across two modules, declare a factory or a service.
Suppose you have a search module:
//you inject your pagination module here
var searchModule = angular.module('search', ['pagination']);
//and you ALSO need to inject your pagination's service into your controller
searchModule.controller('MainController', ['$scope', 'paginationSvc' function($scope, paginationSvc) {
//function from pagination module controller
paginationSvc.testFunction();
}])
And your pagination module:
var pagination = angular.module('pagination', []);
//declare your pagination service here
pagination.factory('PaginationSvc', [function(){
return {
testFunction:testFunction
};
function testFunction(){
console.log('This is from pagination module');
}
}])
Maybe a little plnkr will help :D
You can't inject a controller in a controller. Your pagination
module need to declare a service or factory or provider wich will be be injected in your controller.
See docs here.
You should create a pagination directive and insert that where you need it. You might get some good ideas from this post.