I recently finished developing an AngularJs Application that works flawlessly on Google Chrome and Mozilla Firefox. However, upon testing it on Safari and IE-11, I encountered errors in the console.
One particular piece of code that causes issues is used multiple times to open a bootstrap modal:
$modal.open({
templateUrl: "dummyTemplate.html",
controller: "DummyControllerName",
controllerAs: "vm",
windowClass: 'popupModal',
size: 'sm',
resolve: {
dummyData: function(){ return object; }
}
}).result.then(data => {
});
https://i.sstatic.net/0NaiS.jpg
Another problematic code snippet involves using $rootScope.$on to display toast messages:
$rootScope.$on("toastIt", (e, d) => { // <- This line triggers an error in IE and Safari
toaster.pop(d.type || 'success', d.title, d.text);
});
The issue stems from EcmaScript support limitations in Internet Explorer and Safari. Can anyone suggest the best approach to address this problem and ensure my AngularJs Application can run smoothly on all browsers?
If modifying the code structure is the only solution, it would require changes in numerous places and consume a significant amount of time. Are there any alternative methods to resolve this issue efficiently?