Currently, I am utilizing the latest version of angularjs (1.3.3):
I have integrated 3 JavaScript libraries into my project.
<script src="framework/jquery-1.9.1.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.js"></script>
<script src="framework/tm.pagination.js" ></script>
This is a snippet of my JavaScript code:
angular.module('myApp', ['tm.pagination']).controller('testController', [function($scope, $http){
var reGetProducts = function(){
var postData = {
currentPage: $scope.paginationConf.currentPage,
itemsPerPage: $scope.paginationConf.itemsPerPage
};
// console.log(postData);
$http.get('data/mybook.json').success(function(data){
$scope.paginationConf.totalItems = data.total;
$scope.products = data.items;
});
};
$scope.paginationConf = {
currentPage: 1,
itemsPerPage: 15 //issue arises here as $scope is undefined
};
$scope.$watch('paginationConf.currentPage + paginationConf.itemsPerPage', reGetProducts);
}]);
An error is being encountered:
error: $scope is undefined @http://localhost:8080/table.html:55:13 invoke@https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.js:4129:14 $ControllerProvider/this.$get</</<@https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.js:8370:11 nodeLinkFn/<@https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.js:7618:13 forEach@https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.js:330:11 nodeLinkFn@https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.js:7617:11 compositeLinkFn@https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.js:7003:13 compositeLinkFn@https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.js:7006:13 publicLinkFn@https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.js:6882:30 bootstrapApply/<@https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.js:1439:11 $RootScopeProvider/this.$get</Scope.prototype.$eval@https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.js:14204:16 $RootScopeProvider/this.$get</Scope.prototype.$apply@https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.js:14302:18 bootstrapApply@https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.js:1437:9 invoke@https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.js:4129:14 bootstrap/doBootstrap@https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.js:1435:1 bootstrap@https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.js:1455:1 angularInit@https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.js:1349:5 @https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.js:25746:5 jQuery.Callbacks/fire@http://localhost:8080/framework/jquery-1.9.1.js:1037:10 jQuery.Callbacks/self.fireWith@http://localhost:8080/framework/jquery-1.9.1.js:1148:7 .ready@http://localhost:8080/framework/jquery-1.9.1.js:433:1 completed@http://localhost:8080/framework/jquery-1.9.1.js:103:4
It seems like I have properly declared $scope while injecting the variable.