angularjs – Angular-Ui Bootstrap DatePicker在焦点上打开

虽然这似乎是一个简单的问题,但我找不到任何解决方案.

很简单:

<input type="text" datepicker-popup>

我希望当光标进入时,日历弹出窗口会自动显示,就像jquery-ui datepicker一样.现在我要提供一个按钮或Alt-down,对我都不友好.

一个is-open属性,但是我不想让变量复杂化在可能已经作为配置可用的东西的范围内? :d.

谢谢

解决方法

编辑:

我终于找到了解决方案.这有点棘手,但它确实有效.这是指令:

app.directive("autoOpen",["$parse",function($parse) {
  return {
    link: function(scope,iElement,iAttrs) {
      var isolatedScope = iElement.isolateScope();
      iElement.on("focus",function() {
        isolatedScope.$apply(function() {
          $parse("isOpen").assign(isolatedScope,"true");
        });
      });

      // Remove DOM Event Listener when $destroy lifecycle event is fired
      scope.$on('$destroy',function() { iElement.off("focus") })
    }
  };
}]);

这是观点:

<input type="text" datepicker-popup="" ng-model="ctrl.dt" auto-open />

这是较旧的解决方案:

您可以编写一个指令来在输入焦点时更改is-open的值:

app.directive("autoOpen",iAttrs) {
      var isOpenVarName = iAttrs.isOpen;
      iElement.on("focus",function() {
        $scope.$apply(function() {
          $parse(isOpenVarName).assign(scope,"true");
        });
      });
    }
  };
}]);

这是观点:

<input type="text" datepicker-popup="" auto-open is-open="open" ng-model="ctrl.dt" />

请注意,您必须在控制器中定义open并在input元素中放置is-open =“open”.我知道这不是最好的解决方案.一旦找到更好的解决方案,我会做得更好.

更新:正如@ Akos-lukacs在评论中提到的,当以角度方式禁用调试数据时,此解决方案不起作用.

相关文章

ANGULAR.JS:NG-SELECTANDNG-OPTIONSPS:其实看英文文档比看中...
AngularJS中使用Chart.js制折线图与饼图实例  Chart.js 是...
IE浏览器兼容性后续前言 继续尝试解决IE浏览器兼容性问题,...
Angular实现下拉菜单多选写这篇文章时,引用文章地址如下:h...
在AngularJS应用中集成科大讯飞语音输入功能前言 根据项目...
Angular数据更新不及时问题探讨前言 在修复控制角标正确变...