angularjs - 使用 scope.$eval 将参数传递给指令回调

Question

我有一个在移动鼠标时调用的鼠标滚轮指令。但是如何在回调中传递滚动位置呢？

export function ngMouseWheelDown() {
    return function (scope: angular.IScope, element, attrs) {
        element.bind("DOMMouseScroll mousewheel onmousewheel",
            function (event) {

                // cross-browser wheel delta
                var event = window.event || event; // old IE support
                var delta = Math.max(-1, Math.min(1, (event.wheelDelta || -event.detail)));

                if (delta < 0) {
                    scope.$apply(function () {
                        scope.$eval(attrs.ngMouseWheelDown);
                    });
                }
            });
    }
}

HTML

<div ng-mouse-wheel-up="$ctrl.scrollEvent($event)"
     ng-mouse-wheel-down="$ctrl.scrollEvent($event)"
     style="overflow-y: auto;">

Answer 1

使用 $eval 方法的 locals 参数:

export function ngMouseWheelDown() {
    return function (scope: angular.IScope, element, attrs) {
        element.bind("DOMMouseScroll mousewheel onmousewheel",
            function (event) {

                // cross-browser wheel delta
                var event = window.event || event; // old IE support
                var delta = Math.max(-1, Math.min(1, (event.wheelDelta || -event.detail)));

                if (delta < 0) {
                    var locals = {$event: event, $delta: delta};
                    scope.$apply(function () {
                        scope.$eval(attrs.ngMouseWheelDown, locals);
                    });
                }
            });
    }
}

用法:

<div ng-mouse-wheel-up="$ctrl.scrollEvent($event, $delta)"
     ng-mouse-wheel-down="$ctrl.scrollEvent($event, $delta)"
     style="overflow-y: auto;">

有关详细信息，请参阅- AngularJS scope.$eval API Reference