2014-12-13 62 views
0

大家好!我有这对我的指令模板...角度 - 由父控制器处理的指令的事件

<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!

回答

0

可能有很多不同的方法来做到这一点。一种选择是让你在你的控制器定义了你的指令起飞的事件处理程序,如下所示:

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

然后,在你的指令配置:

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

然后,添加的东西像这样的指令在你的启动/停止方法。

$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 */ } } }

相关问题