javascript - 使用 ng-repeat-start 和 ng-repeat-end 导致过滤器被无限期地调用

Question

过滤器和模板的代码片段如所给出。我无法弄清楚为什么控制台会无限次地出现。

angular.module.filter('sumArrayAttrsFilter', function() {
    return function(sample, propName) {
        console.debug('cp$$$$$$$$$S1::', sample, '::', propName);
        return 99990;
    };
});             

<小时/>

         <table>
            <tbody>
                <tr ng-repeat-start="(key, finData) in {'2014': [{'test': 4}, {'test2': 5}], '2015': [{'test': 4}, {'test2': 5}]} track by key">
                    <td>
                        <div>
                            {{key}}:: {{finData | sumArrayAttrsFilter:'test'}}
                        </div>
                    </td>
                </tr>
                <tr ng-repeat-end>
                    <td>
                        <div>
                            {{key}}:: {{finData | sumArrayAttrsFilter:'test2'}}
                        </div>
                    </td>
                </tr>
            </tbody>
        </table>

Answer 1

似乎对我有用。试试这个方法。

var app = angular.module('myApp', []);
app.filter('sumArrayAttrsFilter', function() {
return function(sample, propName) {
    console.debug('cp$$$$$$$$$S1::', sample, '::', propName);
    return 99990;
};

HTML

<div ng-app="myApp">
    <table>
        <tbody>
            <tr ng-repeat-start="(key, finData) in {'2014': [{'test': 4}, {'test2': 5}], '2015': [{'test': 4}, {'test2': 5}]} track by key">
                <td>
                    <div>
                        {{key}}:: {{finData | sumArrayAttrsFilter:'test'}}
                    </div>
                </td>
            </tr>
            <tr ng-repeat-end>
                <td>
                    <div>
                        {{key}}:: {{finData | sumArrayAttrsFilter:'test2'}}
                    </div>
                </td>
            </tr>
        </tbody>
    </table>
  </div>

对 myApp 模块的引用

 <div ng-app="myApp"> 

使用您的模块引导应用程序。

这是链接[链接]http://plnkr.co/edit/1TQsn2NujRB1ojuurVOd?p=preview