日付上にangular-bootstrap-datetimepickerを閉じる

Question

UIブートストラップのドロップダウンコンポーネントを使用して、クリック時にangular-bootstrap-datetimepickerカレンダーを表示しています。私はほとんどうまく動作しますが、カレンダーブロックはクリックして閉じるだけで、カレンダーをクリックすると閉じません。

jQueryを使用せずにカレンダーブロックの日付をonclickに近づけるにはどうすればよいですか？

Plunker
GIF

<div uib-dropdown> 
    <h4> 
    <a uib-dropdown-toggle href="">Select Date <b class="caret"></b> 
    </a> 
    </h4> 
    <ul uib-dropdown-menu> 
    <datetimepicker data-ng-model="date" data-datetimepicker-config="{ startView:'month', minView:'month' }"></datetimepicker> 
    </ul> 
</div> 

Answer 1

あなたはjQueryのを必要としません。あなたは自動的に閉じるように$scope.$watchとangular.elementを使用することができます：

$scope.$watch('date',function(newValue){ 
    newElement=angular.element(document.getElementsByClassName('.uib-dropdown')) 
    if(!newValue) return 
    angular.element(document.getElementsByClassName('dropdown')).removeClass('open') 
    }) 

は使用の例については、このPlnkrを参照してください：https://plnkr.co/edit/tJr7XO5dJUrIWshyfKX6?p=preview

ジャストノート：タグIDを使用することをお勧めし、代わりにクラス名の（複数のドロップダウンがある場合）。

取り外しとopenクラスを追加することは、ドロップダウン矢印をクリックすると等価です（とカレンダーを表示と非表示）