Question

大家好！我在我的指令模板上有这个...

    <div class="priceSlider" ui-slider="slider.options" min="{{min}}" max="{{max}}" 
step="0.01" use-decimals ng-model="sliderVal"><div>{{currency}} {{sliderVal[0]}} - 
{{currency}}     {{sliderVal[1]}}</div>

..我在我的JS指令

上有这个

angular
.module('app.directives.categoryHead', [])
.directive('categoryHead', function() {
    return {
        restrict : 'E',
        controller: function($scope){
        $scope.sliderVal = [$scope.min , $scope.max];
        $scope.slider = {
            'options': {
                range: true,
                start: function (event, ui) { console.log('Event: Slider start - set with slider options', event); },
                stop: function (event, ui) { console.log('Event: Slider stop - set with slider options', event); }
            }
        }
        },
        scope: {
            language : "=",
            currency : "=",
            breadcrumb : "=",
            min : "=",
            max : "="
        },
        templateUrl: "templates/directives/categoryHead.html"
    }

}）;

...在我的路线模板上，我就是这个......

 <category-head breadcrumb="breadCrumb" min="categoryList.minPrice" 
max="categoryList.maxPrice" language="webshop.language" 
currency="webshop.culture.currency"></category-head>

所以，基本上我有一个滑块...这会触发事件的开始和停止 - 而且这个工作非常好。但我想处理不在指令内的事件，而是处理路径模板的控制器。

如何将事件从指令“转移”到模板控制器？我只需要点击“更改了一些内容”并发送新值的通知。

ty！

Answer 1

可能有很多不同的方法可以做到这一点。一个选项是使您的指令获取您在控制器中定义的事件处理程序，如下所示：

<your-directive on-start="startHandler()" on-stop="stopHandler()></your-directive>

然后，在你的指令config：

scope: { onStart: '&', onStop: '&' }

然后，将这样的内容添加到指令中的start / stop方法中。

$scope.slider = { 'options': { range: true, start: function (event, ui) { if (onStart) onStart(event); /* other stuff */ }, stop: function (event, ui) { if (onStop) onStop(event); /* other stuff */ } } }

angular - 由父控制器处理的指令的事件

1 个答案: