Why Would A Hash Computation Using CryptoJS Cause A $rootScope:infdig Error In Angular?
Solution 1:
Providing ng-bind="sha1('bar')"
makes the digest cycle unstable, everytime sha1 function returns a different object (reference is different) and your digest cycle has to run again to stabilize it and every digest cycle again evaluates the ng-bind function expression and it goes on till it reaches the max limit set (10). You can also easily replicate this issue by just doing return []
in your scope method. This is just a side effect of not so good practice of binding a function expression to ng-bind
as it runs every digest cycle, if at all used it should be carefully evaluated.
One simple solution is to bind ng-change/ng-blur event on your password or any other trigger and just bind ng-bind to a property instead of a function expression.
angular.module('app',[])
.constant('Crypto', window.CryptoJS);
function MyCtrl($scope, Crypto) {
$scope.encrypt = function() {
$scope.encrypted = Crypto.SHA1($scope.password);
};
}
<html lang="en" ng-app="app">
<head>
<script src="http://crypto-js.googlecode.com/svn/tags/3.1.2/build/rollups/sha1.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>
</head>
<body>
<div class="app" ng-app ng-controller="MyCtrl">
<input id="password" ng-model="password" type="password" placeholder="Password" ng-change="encrypt()">
<span ng-bind="encrypted"></span>
</div>
</body>
</html>
For better usage of DI i have placed crpto in a constant and inject it where needed.
Post a Comment for "Why Would A Hash Computation Using CryptoJS Cause A $rootScope:infdig Error In Angular?"