Question

我正在尝试编写一个自定义指令，它只是在表达式求值为true时触发指定的事件。以下内容适用于绑定的单个值 -

<div ng-trigger="value.someBoolean" /> 

app.directive('ngTrigger', [
    "$timeout","$log", function($timeout,$log) {
        return {
            restrict:"A",
            link: function(scope, elem, attr) {

                scope.$watch(attr.ngTrigger, function (e) {

                    if (e) {
                        $timeout(function() {
                            elem.triggerHandler('someevent');
                        });
                    } else {
                        $timeout(function () {
                            elem.triggerHandler('someotherevent');
                        });
                    }


                });

            }
        };

    }
]);

但是，如果尝试绑定更复杂的表达式（如< - p>），则此方法将失败

<div ng-trigger="!value.someBoolean && value.someOtherBoolean" />

如何将此指令从使用简单的观察器移动到评估此表达式？而且，我怎样才能确定何时两个表达式成员都会改变？

Answer 1

好的，我明白了。使用$ parse服务。 This博文有很多帮助。

我将指令更改为以下内容 -

  app.directive('ngTrigger', [
    "$timeout","$parse","$log", function($timeout,$parse,$log) {
        return {
            restrict:"A",
            link: function(scope, elem, attr) {
                //create a model from the expression using parse
                var model = $parse(attr.ngTrigger);
                //watch the resulting model
                scope.$watch(model, function(val) {
                    if (val) {
                        $timeout(function () {
                            elem.triggerHandler(attr.ngTriggerTrue);
                        });
                    } else {
                        $timeout(function () {
                            elem.triggerHandler(attr.ngTriggerFalse);
                        });
                    }

                });

            }
        };

    }
]);

此方法适用于

<div ng-trigger="someValue.someBoolean"></div>

和

<div ng-trigger="someValue.someBoolean && someValue.someOtherBoolean"></div>

Answer 2

你能尝试提供一个带有函数而不是字符串表达式的表，并使用范围。$ eval：

scope.$watch(function(scope){return scope.$eval(attr.ngTrigger)}, function (e) {

这类似于您突出显示的解析方法。

评估自定义指令值

2 个答案: