I'm newbie to AngularJS. Beginning with the script worked fine when in development, after uploaded to production, I got RangeError in my Controller. I confused about this error, even I searching with Google still not solved :(
Here's my script on routeProvider :
.when('/customer/detail/:id', {
title: 'Customer Detail',
templateUrl: 'templates/customer_detail.html',
resolve: {
app: function($q, $rootScope, $location, roles) {
var defer = $q.defer();
if (roles.pageCustomer !== true) {
$location.path('/main.html');
};
defer.resolve();
return defer.promise;
}
}
})
Then on my Controller :
app.controller('ctrl_customer_list', function($scope){
$scope.title = "Customer List";
$('#datatable_customer').DataTable({
bServerSide: true,
bDestroy: true,
responsive: true,
iDisplayLength: 250,
serverSide: true,
columnDefs: [ {
targets: 0,
orderable: false,
targets : 1,
"render": function ( data, type, row, meta ) {
var itemID = row[8];
return '<a href="customer/detail/' + itemID + '">' + data + '</a>';
}
}],
lengthMenu: [ 10, 25, 50, 75, 100, 250, 500, 1000 ],
aaSorting: [[1, 'asc']],
ajax:{
url :"backend/customer/list", // json datasource
type: "post", // type of method ,GET/POST/DELETE
error: function(){
$("#datatable_processing").css("display","none");
}
},
language: {
searchPlaceholder: 'Search...',
sSearch: '',
lengthMenu: '_MENU_ items/page',
}
});
$('.dataTables_length select').select2({ minimumResultsForSearch: Infinity });
});
I got following error when the code has been production :
RangeError: Maximum call stack size exceeded
at Function.n.extend.n.fn.extend (jquery.js:177)
at Function.n.extend.n.fn.extend (jquery.js:228)
at Function.n.extend.n.fn.extend (jquery.js:228)
at Function.n.extend.n.fn.extend (jquery.js:228)
at Function.n.extend.n.fn.extend (jquery.js:228)
at Function.n.extend.n.fn.extend (jquery.js:228)
at Function.n.extend.n.fn.extend (jquery.js:228)
at Function.n.extend.n.fn.extend (jquery.js:228)
at Function.n.extend.n.fn.extend (jquery.js:228)
at Function.n.extend.n.fn.extend (jquery.js:228)
(anonymous) @ angular.js:15536
(anonymous) @ angular.js:11815
(anonymous) @ angular.js:21559
Pg.completeTask @ angular.js:21194
(anonymous) @ angular.js:6790
setTimeout (async)
h.defer @ angular.js:6788
f @ angular.js:21554
(anonymous) @ select2.js:194
(anonymous) @ angular.js:1365
Ba @ angular.js:11235
q @ angular.js:10554
g @ angular.js:9801
g @ angular.js:9804
g @ angular.js:9804
g @ angular.js:9804
g @ angular.js:9804
q @ angular.js:10548
g @ angular.js:9801
g @ angular.js:9804
g @ angular.js:9804
q @ angular.js:10548
g @ angular.js:9801
(anonymous) @ angular.js:9666
link @ angular-route.js:1260
(anonymous) @ angular.js:1365
Ba @ angular.js:11235
q @ angular.js:10554
g @ angular.js:9801
(anonymous) @ angular.js:9666
(anonymous) @ angular.js:10080
d @ angular.js:9844
m @ angular.js:10604
C @ angular-route.js:1209
$broadcast @ angular.js:19683
(anonymous) @ angular-route.js:749
(anonymous) @ angular.js:17914
$digest @ angular.js:19075
$apply @ angular.js:19463
k @ angular.js:13312
w @ angular.js:13569
E.onload @ angular.js:13474
load (async)
(anonymous) @ angular.js:13457
s @ angular.js:13257
(anonymous) @ angular.js:12998
(anonymous) @ angular.js:17914
$digest @ angular.js:19075
$apply @ angular.js:19463
(anonymous) @ angular.js:15270
dispatch @ jquery.js:4435
r.handle @ jquery.js:4121
I'm using AngularJS 1.7.5 and GruntTasker. Any advice? Many thanks for helping (sorry my english)
just update to resolve issue. First, I follow instruction as @numbtongue mention. It's finally found the problems come from AngularJS-select2. I tried to remove AngularJS-select2 from repositories and finally worked !
Thank you very much @numbtongue as instruction debugging with Chrome.
PS: With the debugger you can see, how many script execute within a time.