Our Angular.js Web App is experiencing occasional freezing on iOS8 Safari. When the freeze occurs, the ng-click callback fails to trigger. Interestingly, replacing ng-click with a standard javascript onclick resolves the issue. It's worth noting that this problem does not occur in Chrome on iOS8 devices.
Are there others who have encountered similar issues with iOS8 Safari or found a solution?
This particular view sometimes becomes unresponsive on iOS8 Safari. The freezing typically occurs when switching tabs within the browser or navigating away from and then returning to the page. For instance, in the provided example, the tapCount fails to increase when tapping on links as the view freezes. The more complex the view, the higher the likelihood of encountering a freeze. In this scenario, the browser may pause for a few seconds when rapidly tapping on links. Freezing tends to last even longer with more intricate views.
var app = angular.module('myApp', []);
app.controller('freezeCtrl', function($scope) {
$scope['tapCount'] = 0;
$scope['dummyItems'] = [];
for(var i = 0; i < 15; i++) {
var anItem = {'id': i};
($scope['dummyItems']).push(anItem);
}
$scope['updateTapCount'] = function() {
$scope.tapCount += 1;
};
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.min.js"></script>
<div ng-app="myApp">
<div ng-controller="freezeCtrl">
<p>Tap Count = {{tapCount}}</p>
<ul>
<li ng-repeat="item in dummyItems" bindonce>
<p>This is a dummy item #{{item.id}}</p>
</li>
</ul>
<div>
<button ng-click="updateTapCount()">Button 1</button>
<button ng-click="updateTapCount()">Button 2</button>
</div>
</div>
</div>