Angular 2 javascript 和日期选择器

Question

我正在尝试使用 angular 2 和 javascript 创建一个应用程序。我想要日期输入，我已经读到 html 5 输入类型 "date" 不受所有 browsers.I 搜索 angular 2 的日期选择器的支持，我发现了很多datepickers 但具有打字稿支持，例如 ( Does anyone know a easy date picker to use in an angular 2 app?）。 我的问题是 angular 2 是否有支持 javascript 的日期选择器，或者是否有办法在 javascript 中导入 typescipt 日期选择器？

Answer 1

访问 ng2-bootstrap，它有 800 颗星，看看这个日期选择器，https://github.com/valor-software/ng2-bootstrap/blob/development/src/datepicker/datepicker.component.ts

如果您想要 javascript 日期选择器，只需使用 bootstrap

中的那个

http://www.eyecon.ro/bootstrap-datepicker/

Answer 2

您可以使用jQuery日期选择器，它提供了很多功能，而且您可以完全控制这些功能。

例如：您不能在 html-datepicker 中限制您的日期范围 但是 jQuery-datepicker 你可以限制日期范围

您可以从这里下载：http://jqueryui.com/download/

Answer 3

最后，这个问题归结为 如何将 JavaScript 日期选择器库与 Angular2 集成？。

如果您只对以文本值形式返回日期感兴趣，例如：2016 年 6 月 18 日星期六，事情就很简单了。这一切都取决于图书馆如何返回选定的日期。

如果您查看 this library，您会发现它使用文本输入来存储所选日期：

<input type="text" id="datepicker">

您需要做的就是将值导入 Angular2。就这样。

• 您可以使用模糊事件来做到这一点：

  <input type="text" id="datepicker" 
      #datePicker (blur)="onDateChange(datePicker.value);">
  

• 甚至可以给ngModel赋值，从而实现双向数据绑定：

  <input type="text" id="datepicker" 
      #datePicker [ngModel]="date" (blur)="date = datePicker.value">
  

或多或少，您已经将 Pikaday 库完全移植到 Angular2。

最后一点，将它包装到一个独立的 Angular2 组件中是个好主意，因为您将获得可重用性和封装的好处。