每个单元应用自定义角滤波器

Question

查看利用AngularJS掌握网络开发，我运行了这个自定义过滤器来修剪文本，删除最后3个字符，如果输入超过限制，就追加...。

app.html

  <div ng-controller="MyCtrl">
       <table>
        <thead>
            <th>Name</th>
        </thead>
        <tbody>
            <tr ng-repeat="s in strs | customTrim:2">
                <td>{{s}}</td>
            </tr>
        </tbody>
    </table>

app.js

var myApp = angular.module('myApp',[]);

myApp.controller("MyCtrl", function ($scope) {

    $scope.strs = ["HEY THERE", "me"];

});

myApp.filter('customTrim', function($filter) {
    var limitToFilter = $filter('limitTo');

    console.log("limitToFilter('ABCDEF', 2)", 
        limitToFilter('ABCDEF', 2));

    return function(input, limit) {
        console.log("input:", input, "input.length", input.length,
         "limit:", limit);
        if(input.length > limit) {
            console.log("returning...");
            console.log(limitToFilter(input, limit-3) + "...");
            return limitToFilter(input, limit-3) + "...";
        }
        return input;
    }
});

然而，strs的长度，而不是单个的s，似乎正在打印出来。

如何将数组的每个项传递到我的customFilter中

控制台

limitToFilter('ABCDEF', 2) A 
input: ["HEY THERE", "me"] input.length 2 limit: 2 
input: ["HEY THERE", "me"] input.length 2 limit: 2 

Answer 1

应该在字符串上使用筛选器，而不是在数组上使用：

<tr ng-repeat="s in strs">
    <td>{{s | customTrim:2}}</td>
</tr>