AngularJS通过自定义过滤器函数$ rootScope：infdig将范围传递给指令

我已经在angularJs中创建了简单的自定义指令。在该指令中，我将对象数组作为tableLayout传递。请参阅我的工作jsfiddle，没有错误。

JS小提琴工作

但是我需要传递一个经过过滤的tableLayout。我已经在范围内创建了一个名为filterFilterFn的函数来过滤值，然后将其传递给指令的范围。当我这样做时，我收到$ rootScope：infdig错误。

带过滤器功能的Js Fiddle不起作用

读取另一个类似的问题是与在angularJs中使用默认过滤器有关。因此，为什么要在示波器中完成自定义过滤器功能。但是我仍然遇到同样的错误。关于我做错了什么的建议将不胜感激。

下面的无效代码：

<div ng-app="myApp" ng-controller="mainCtrl">
    <script type="text/ng-template" id="/template">
        <button ng-click="testFn()">Test</button>
        <div layout="row">
            <div flex ng-repeat="col in [1,2,3]"><span>HEADER{{$index}}</span>
                <div layout="column">
                    <div flex style="border: 1px solid black;" ng-repeat="row in [1,2,3]">{{$index}}</div>
                </div>
            </div>
        </div>
    </script> 
    <button ng-click="testFn()">Test 2</button>
    <form-table table-layout=formFilterFn('table_id',1)></form-table>
</div>

var app = angular.module('myApp', ['ngMaterial']);
app.controller('mainCtrl', function($scope) {
    $scope.tableLayout =[{"head_id":"GAP Assessment","table_id":"1","table_name":"GAP Table","element_id":"0","element_name":"Action Reference","sort_order":"0","is_multirow":"1","flex":"30","element_sort_order":"4","is_show":"0"},{"head_id":"GAP Assessment","table_id":"1","table_name":"GAP Table","element_id":"1","element_name":"Audit Criteria","sort_order":"0","is_multirow":"1","flex":"30","element_sort_order":"0","is_show":"1"},{"head_id":"GAP Assessment","table_id":"1","table_name":"GAP Table","element_id":"3","element_name":"Document Reference","sort_order":"0","is_multirow":"1","flex":"10","element_sort_order":"3","is_show":"1"},{"head_id":"GAP Assessment","table_id":"1","table_name":"GAP Table","element_id":"4","element_name":"Findings - General","sort_order":"0","is_multirow":"1","flex":"20","element_sort_order":"1","is_show":"1"},{"head_id":"GAP Assessment","table_id":"1","table_name":"GAP Table","element_id":"5","element_name":"Findings Details","sort_order":"0","is_multirow":"1","flex":"40","element_sort_order":"2","is_show":"1"}]
    $scope.testFn=function(){
       console.log("Test");
   }
   $scope.formFilterFn = function(key,value){
       var output = [];
       var input = $scope.tableLayout;
       for (var x =0; x < Object.keys(input).length; x++){                                  
           if (input[x][key]==value){                                       
               output.push(input[x]);                                   
           }                                        
       }    
       return output;
   }

});
app.directive('formTable', function() {
    return {
        scope:{tableLayout:'='},
        link: function(scope,element,attrs){ // normal variables rather than actual $scope, that is the scope data is passed into scope

                    scope.column=[1,2,3];
                    scope.testFn=function(){
                        console.log(scope.tableLayout);
                    }



                    //function and scopes go here
                },//return
        transclude:true,
        templateUrl: '/template',
        restrict: 'E'        
    }
})