2016-12-20 7 views
0

私はリンクを2つのdatepickerディレクティブにしようとしています。私はディレクティブの1つにモデルを渡していますが、値が変更されたときにメソッドを実行する必要があります。リンク機能は発動しません。私は過去2日間この問題を解決しようとしてきました...私が投げるものは何も働かない...誰かが見て、何が間違っていることを説明することができますか?

初期リンクが間違っていたように私は、セットアップplunker http://plnkr.co/edit/VTSElDjniyN8wRwsuT1T?p=preview

JacvascriptコードUPDATE

以下21/12/2016更新plunkerリンクしました。あなたは model両方 directivesに渡しているので modelが、1つのつではなく、ディレクティブでモデルを上げる見ての、 parent scopeではなく directive scopeに座っているので、そのうちの一つが変更されたとき

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

あなたのplunkrとコードは一致しません。 –

+0

私はendDateがオブジェクトではないので、ウォッチの最後にtrueオプションを削除してみてください。 –

答えて

0

は、更新は1には反映されませんイベント時に1でモデルの変更と第2のモデルでは、そのイベントを監視し、そこにあなたの操作を行います。

まずディレクティブ:

link: function(scope, elm, attrs) { 

    elm.bind('blur', function() { 
     var currentValue = elm.val(); 
     scope.$emit('FIRST_DATE_UPDATED', currentValue); 
    }); 
} 

そして、第2の指示文では、

+0

あなたのご意見をお寄せいただきありがとうございます。はい、確かにリンクが間違っていましたこれはスタック上の私の最初の質問だったので、私の手が少し不安だった:)アイザナの感謝のYaser私は私のend-datepickerディレクティブがng-controllerスコープのoustideだったので、スコープ...スコープを取得するようになりました。$ウォッチメソッドを使用して新しい価値を引き出すことができましたが、状況が発生した場合にどのように使用できるかを見るために、$ watchソリューションを使って提案を試みましたが、 。正しいリンクを置くhttp://plnkr.co/edit/VTSElDjniyN8wRwsuT1T?p=preview – MrPZzZ

関連する問題