自定义指令范围。$ watch未被触发

时间:2016-12-20 20:26:53

标签: javascript angularjs

我正在尝试链接两个datepicker指令我将模型传递给其中一个指令,我需要在值改变时运行几个方法,但是当值改变范围时。$ watch in linking function不会被触发。过去两天我一直试图解决这个问题无济于事......我抛出的任何东西都行不通。有人可以看看并解释出了什么问题吗?

我已经设置了一个http://plnkr.co/edit/VTSElDjniyN8wRwsuT1T?p=preview

下面的Jacvascript代码

UPDATE 21/12/2016更新了plunker链接,因为初始链接不正确。

angular.module('ui.bootstrap.demo').directive('endDatepicker', function() {
return {
  scope: {
      model: "=",
      endDate: "=",
  },
  templateUrl: 'datepicker-template.html',
  link: function(scope, element, attr) {
      scope.$watch('endDate', function(newValue,oldValue){
          console.log("Watch fired" + scope.endDate)
          scope.dateOptions.minDate = scope.endDate;
      },true)


     scope.popupOpen = false;
      scope.openPopup = function($event) {
          $event.preventDefault();
          $event.stopPropagation();
          scope.popupOpen = true;
      };

      scope.dateOptions = {
        startingDay: 1,
        minDate: moment.utc()._d
      }
      scope.open = function($event) {
        $event.preventDefault();
        $event.stopPropagation();
        scope.opened = true;
      };

  }
 };
}); 

1 个答案:

答案 0 :(得分:0)

由于您将model传递给directives,因此当model位于directive scope而不是parent scope时,更新不会反映在其中之一link: function(scope, elm, attrs) { elm.bind('blur', function() { var currentValue = elm.val(); scope.$emit('FIRST_DATE_UPDATED', currentValue); }); } ,而不是在一个指令中观察模型时,当模型在一个模型中更改并在第二个模型中观察该事件并在那里进行操作时,会引发一个事件:

第一条指令:

link: function(scope, elm, attrs) {

    scope.$on('FIRST_DATE_UPDATED', function(e, data){
        var newDateValue = data;
        //do your stufdf here
    });
}

在第二个指令中:

WEBIOPI_SUBDIR = python