僅在AngularJS中左鍵單擊禁用焦點事件

Question

我有一個角度帶式日期選擇器，我只想在右鍵單擊時顯示。

這個我想做的是默認的focus（）方法，因為這很容易在它模糊時關閉它。 要在像DIV這樣的任何元素上使用焦點方法，我添加了一個tabindex。

問題是，我似乎無法僅在左鍵單擊時禁用焦點。 它要么完全禁用，要么兩者兼而有之。

我已經阻止右鍵單擊顯示上下文菜單。

directives.directive('ngRightClick', ["$parse", function($parse) {
  return function(scope, element, attrs) {
    var fn = $parse(attrs.ngRightClick);
    element.bind('contextmenu', function(event) {
        scope.$apply(function() {
            event.preventDefault();
            fn(scope, {$event:event});
        });
    });
  };
}])

對於左鍵單擊，我嘗試過preventDefault（），但這並沒有真正起作用。 然后我試圖在點擊上模糊它，這有效，但焦點事件仍然預先調用，只有幾分之一秒。

directives.directive('ngLeftNofocus', ["$parse", function($parse) {
  return function(scope, element, attrs) {
    var fn = $parse(attrs.ngLeftNofocus);
    element.bind('click', function(event) {
        scope.$apply(function() {
            event.preventDefault();
            element[0].blur();
        });
    });
  };
}])

這可以在Plnkr中找到： http ：//plnkr.co/edit/T2YBYwfqSLKxCUL0ITgk？p = preview

我知道有一些解決方案可以防止在這個網站上使用jQuery進行焦點，但是我需要它以某種方式保持活躍的右鍵單擊。

或者，如果某人有更好的方法只在右鍵單擊時觸發日期選擇器（一旦用戶點擊其他地方它也會關閉），我也很樂意看到它。

Answer 1

您可以使用bs-show屬性手動切換日期選擇器。

結合ng-right-click和ng-blur ，它將提供您想要的效果。

<div bs-datepicker ng-model="test" tabindex="1"
    data-trigger="manual"
    bs-show="showDatePicker"
    ng-blur="showDatePicker = false"
    ng-right-click="showDatePicker = true">CLICK HERE</div>

示例Plunker： http ：//plnkr.co/edit/zJXdZOIZ9XQey3BkQ3I2？p = preview