如何在 angular4 中使用 jQuery UI DateRangePicker？

Question

我看过jQuery UI DateRangePicker的demo，但是没有找到在angular4中的使用方法，因为angular2中没有jQuery UI DateRangePicker的包。请告诉我们如何在 angular4 中使用。我使用的角度版本是：- 4.3.3

Answer 1

您可以从 NPM 下载 jQuery Ui，查看此链接 https://www.npmjs.com/package/jquery-ui 您可以下载 ui 选择器 js 文件，并可以从项目目录中使用它们。 检查此答案以将 js 文件添加到您的视图中 https://stackoverflow.com/a/41899261/713789

Answer 2

是的，根据文档，没有 npm 包可以在您的 angular2 应用程序中使用此 dateRangePicker，所以如果您想 在您的项目中使用它，请完成以下步骤。

1. 手动安装所有依赖项并相应地在您的应用程序的.angular-cli.json 文件中列出所有依赖项。

     <link href="jquery-ui.min.css" rel="stylesheet">
     <link href="jquery.comiseo.daterangepicker.css" rel="stylesheet">
     <script src="jquery.min.js"></script>
     <script src="jquery-ui.min.js"></script>
     <script src="moment.min.js"></script>
     <script src="jquery.comiseo.daterangepicker.js"></script>
   

2. 在组件顶部插入此 lineHeight

   declare var $: any;
   

3. 在你的组件的构造函数中调用这个方法

   $(function() { $("#e1").daterangepicker(); });
   

PS：将 id 替换为您的 ID 名称。