angularjs – 扩展datepicker的功能(ui bootstrap)

发布时间：2020-12-17 18:03:34 所属栏目：安全来源：网络整理

导读：我正在尝试为datepicker扩展ui bootstrap的功能.我想使用一个我已经为其他元素制作的可拖动指令,所以我可以拖延时间. (最终的功能是将该日期分配给某些任务).对我来说最理想的是不修改ui bootstrap库.我试图在datepicker的最终html中插入指令然后使用编译,但

我正在尝试为datepicker扩展ui bootstrap的功能.我想使用一个我已经为其他元素制作的可拖动指令,所以我可以拖延时间. (最终的功能是将该日期分配给某些任务).对我来说最理想的是不修改ui bootstrap库.我试图在datepicker的最终html中插入指令然后使用编译,但我不能使它工作.

有谁能够帮我？非常感谢你

解决方法

如果你想要一个更强大的日期选择器,你可以使用 Dan Grossman’s DateRangePicker.

enter image description here

您还可以使用角度的良好实现.

https://www.npmjs.com/package/angular-daterangepicker

只需在您的角度模块中注入库.

App = angular.module('app',['daterangepicker']);

然后在控制器中声明一个模型.

exampleApp.controller('TestCtrl',function () {
  var vm = this;
  vm.datePicker.date = {
    startDate: null,endDate: null
  };
}

最后在视图中使用该指令.

<div ng-controller="TestCtrl as ctrl">
  <input date-range-picker class="form-control date-picker" type="text" ng-model="ctrl.datePicker.date" />
</div>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!