Question

我正在使用$ filter来遍历数组并获取特定值

以下是我的代码：

var selected = $filter('filter')($scope.folders, {url: el.selected[0] });

此代码正常运行，但是当网址包含重音和空格时，我遇到了问题：

/ Users / Me / project / products /Posteàsouder

在这种情况下，字符串比较不再起作用了。

解决这种情况的更简洁方法是什么？

Answer 1

那是真的。作为一个法语，我经常遇到angularjs的编码/解码问题。

默认过滤器的源代码如下

function filterFilter()
{
    return function(array, expression, comparator)
    {
        if (!isArrayLike(array))
        {
            if (array == null)
            {
                return array;
            }
            else
            {
                throw minErr('filter')('notarray', 'Expected array but received: {0}', array);
            }
        }

        var expressionType = getTypeForFilter(expression);
        var predicateFn;
        var matchAgainstAnyProp;

        switch (expressionType)
        {
            case 'function':
                predicateFn = expression;
                break;
            case 'boolean':
            case 'null':
            case 'number':
            case 'string':
                matchAgainstAnyProp = true;
                //jshint -W086
            case 'object':
                //jshint +W086
                predicateFn = createPredicateFn(expression, comparator, matchAgainstAnyProp);
                break;
            default:
                return array;
        }

        return Array.prototype.filter.call(array, predicateFn);
    };
}

和predicate生成器如下所示：如果提供的不是函数，它会生成默认比较器

function createPredicateFn(expression, comparator, matchAgainstAnyProp)
{
    var shouldMatchPrimitives = isObject(expression) && ('$' in expression);
    var predicateFn;

    if (comparator === true)
    {
        comparator = equals;
    }
    else if (!isFunction(comparator))
    {
        comparator = function(actual, expected)
        {
            if (isUndefined(actual))
            {
                // No substring matching against `undefined`
                return false;
            }
            if ((actual === null) || (expected === null))
            {
                // No substring matching against `null`; only match against `null`
                return actual === expected;
            }
            if (isObject(expected) || (isObject(actual) && !hasCustomToString(actual)))
            {
                // Should not compare primitives against objects, unless they have custom `toString` method
                return false;
            }

            actual = lowercase('' + actual);
            expected = lowercase('' + expected);
            return actual.indexOf(expected) !== -1;
        };
    }

    predicateFn = function(item)
    {
        if (shouldMatchPrimitives && !isObject(item))
        {
            return deepCompare(item, expression.$, comparator, false);
        }
        return deepCompare(item, expression, comparator, matchAgainstAnyProp);
    };

    return predicateFn;
}

演讲太多了。您可以选择：

为您的过滤器see the doc提供comparator
- 但请记住，您无法在角度模板中定义内联函数
- 您可以在该范围内定义一个函数，但它只能在该范围内使用

您可以编写自己的过滤器

.filter('myCustomFilter', function()
{
    return function(input, criteria)
    {
        ... // your logic here
        return ...// the filtered values  
    };
})

Answer 2

也许最好编写自己的过滤器：

app.filter("customFilter", function () {
    //the filter will accept an input array, the key you want to look for and the value that the key should have
    return function (array, key, value) {
      return array.filter(function(x){
        return (x.hasOwnProperty(key) && (x[key] === value));
      });
    };
});

在你的控制器中使用它，如：

$scope.filtered = $filter("customFilter")($scope.folders, "url", "/Users/Me/project/products/Poste à souder");

查看有效的演示here。

使用过滤器AngularJS发出问题

2 个答案: