要解决“Angular UI Grid的自定义过滤器在超过10列时无法显示”的问题，你可以尝试以下方法：

1. 使用Angular UI Grid的默认过滤器： Angular UI Grid提供了默认的过滤器，你可以直接使用它们而不需要自定义过滤器。默认过滤器可以处理任意数量的列，并且在超过10列时也能正常显示。

   例如，使用cellFilter和filter属性来将默认过滤器应用于单元格和列：

   $scope.gridOptions = {
     columnDefs: [
       { field: 'name', displayName: 'Name', cellFilter: 'filter' },
       { field: 'age', displayName: 'Age', filter: { type: uiGridConstants.filter.SELECT } },
       // 其他列...
     ],
     // 其他选项...
   };
   

2. 使用自定义模板过滤器： 如果你仍然需要自定义过滤器，你可以尝试使用自定义模板过滤器来解决问题。自定义模板过滤器可以通过自定义列模板来实现，并且可以处理任意数量的列。

   首先，创建一个自定义模板过滤器的HTML文件，例如custom-filter-template.html：

   在你的Angular UI Grid配置中，将headerCellTemplate属性设置为你的自定义模板过滤器：

   $scope.gridOptions = {
     columnDefs: [
       { field: 'name', displayName: 'Name', headerCellTemplate: 'custom-filter-template.html' },
       { field: 'age', displayName: 'Age', headerCellTemplate: 'custom-filter-template.html' },
       // 其他列...
     ],
     // 其他选项...
   };
   

   这样，无论有多少列，你的自定义模板过滤器都会正确显示，并且可以正常工作。

请注意，以上解决方法仅提供了一种解决问题的思路，你可能需要根据你的具体情况进行适当的调整。