我正在编写一个自定义角度过滤器,随机大写传递给它的输入.
这是代码:
angular.module('textFilters',[]).filter('goBananas',function() { return function(input) { var str = input; var strlen = str.length; while(strlen--) if(Math.round(Math.random())) { str = str.substr(0,strlen) + str.charAt(strlen).toUpperCase() + str.substr(strlen+1); } return str; }; });
我这样称呼它是这样的:
<a class='menu_button_news menu_button' ng-href='#/news'> {{"News" | goBananas}} </a>
它工作正常,但在我的控制台中我看到了一个rootScope:infdig(infinite digest)循环.
我很难理解为什么会这样,以及我可以做些什么来解决它.如果我理解正确,这是因为此函数调用了超过5个摘要动作.但输入只被过滤器调用一次,对吧?
任何帮助赞赏.
由于摘要将继续运行,直到达到模型的一致状态或将运行10次迭代,因此您需要自己的算法来生成伪随机数,这些伪随机数将为相同的字符串返回相同的数字,以避免无限的摘要循环.如果算法将使用字符值,字符位置和一些可配置种子来生成数字将是好的.避免在此类算法中使用日期/时间参数.这是一个可能的解决方案:
HTML
<h1>{{ 'Hello Plunker!' | goBananas:17 }}</h1>
JavaScript的
angular.module('textFilters',[]). filter('goBananas',function() { return function(input,seed) { seed = seed || 1; (input = input.split('')).forEach(function(c,i,arr) { arr[i] = c[(c.charCodeAt(0) + i + Math.round(seed / 3)) % 2 ? 'toUpperCase' : 'toLowerCase'](); }); return input.join(''); } });
您可以使用种子参数来更改位算法.例如,它可能是ngRepeat的$index