javascript-在过滤器中从$rootScope调用实用程序函数

我有一个实用程序函数notNull()打算与以下过滤器一起使用：

 ...| filter:notNull()"

我在更多指令中需要它,这就是为什么我将其放在$rootScope中.

问题是我的过滤器没有被调用,我创建了一个示例plnkr：

http://plnkr.co/edit/Nq0iLw?p=preview

有人可以帮忙吗？为什么不调用过滤器而不过滤我的物品？

PS.过滤器中的此表达式不能用于null：

 ...| filter:{myProp:!null}

解决方法:

[注意：更新以相反的时间顺序排列.]

更新2

首先,回答您的问题“为什么… |过滤器：{myProp：！null}不起作用：
这是因为您尝试使用的语法(根据the docs)仅适用于字符串值(而null不是字符串值).

您可以创建(并附加到您的应用程序)自定义过滤器：

app.filter("notEqual", function() {
    return function(items, key, value) {
        var filtered = [];
        items.forEach(function(item) {
            if (item && (item[key] !== undefined) 
                    && (item[key] !== value)) {
                filtered.push(item);
            }
        });
        return filtered;
    };
});

然后从这样的任何指令中使用它：

...| notEqual:'<keyName>':<valueToCompareAgainst>

例如.：

app.directive("mytag", function() {
    return {
        restrict: "E",
        template: "<div ng-repeat=\"item in myModel | notEqual:'a':null\">"
                + "    item: {{item}}"
                + "</div>",
        scope: {
            myModel: "="
        }
    };
});

另请参见其他short demo.

更新

对服务方法或工厂使用实用程序方法可能是一个更好的主意,该方法应可用于许多控制器/作用域并且应可自定义.例如.：

app.factory("notNullFactory", function() {
    var factory = {};
    factory.notNull = function(caption) {
        return function(item) {
            console.log(caption + " " + JSON.stringify(item));
            return (item !== null);
        };
    };
    return factory;
});

现在,您可以使用notNullFactory的notNull(…)函数来创建可自定义的过滤器函数：

app.directive("mytag", function(notNullFactory) {
    return {
        restrict: "E",
        template: "<div>"
                + "    <div ng-repeat=\"item in myModel | filter:notNull('Checking')\">"
                + "        item: {{item}}"
                + "    </div>"
                + "</div>",
        scope: {
            myModel: "="
        },
        link: function($scope) {
            $scope.notNull = function(caption) {
                return notNullFactory.notNull(caption);
            };
        }
    };
});

另请参见其他short demo.

不是您的过滤器没有被调用,而是未定义.在定义$scope.notNull并将其设置为等于$rootScope.notNull时,后者是未定义的.

相反,您可以摆脱链接属性并使用：

...| filter:$parent.notNull()...

另请参见此short demo.

标签：angularjs,angularjs-directive,javascript
来源： https://codeday.me/bug/20191030/1966464.html