Angularjs 简单日期选择器指令示例

在本节中，我们将使用 AngularJS 实现日期选择器指令。 为了实现这一点，将使用 ngDatepicker 插件。 我们可以轻松地集成和使用它。 它具有灵活性，因此可以轻松设置格式和其他选项。 例如，我们想在我们的 Angularjs 项目中添加一个包含所有功能（例如 MaxDate，MinDate 等）的日期选择器。 在这种情况下，我们将无法获得大量的无错误，高效执行，需求友好的模块，就像 jQuery UI 日期选择器一样。

在我们的 Angular 项目中，如果我们计划使用 jQuery 日期选择器的指令，则此选项对于我们的项目将非常有用，因为它非常健康，快速且具有强大的功能，并且有很多选项。 日期选择器指令的一些基本选项是 MaxDate，MinDate，默认情况下，它是日期。 但是，根据我们的要求，我们可以使用相同的过程在我们的指令中添加很多选项，这是主要功能之一。 此指令能够执行以下某些配置。

如果我们希望禁用今天之前的日期，我们将在项目中用指令编写[minimumDate] = "true"。 如果我们只是想显示日期选择器，我们将在项目中用指令编写[onlyDatePicker] = "false"。

每个网站的主要需求都是日期选择器，如果我们使用 Angularjs 开发 Web 应用程序，那么指令将对我们来说是一个非常令人兴奋的组件。 如果我们要为日期条目启用输入字段，日期选择器将非常有用。 使用它，我们可以轻松选择日期，并且它对用户友好。 在下面的示例中，我们将看到如何添加日期选择器。 此示例包括以下内容

我们将包含链接上的 /css/ngDatepicker.css 路径。 之后，我们将使用此链接 https://raw.githubusercontent.com/jkuri/ngDatepicker/master/src/css/ngDatepicker.css 下载 CSS 文件。 我们还将包括 /js/ngDatepicker.min.js 脚本标签。 之后，我们将使用此链接 https://raw.githubusercontent.com/jkuri/ngDatepicker/master/src/js/ngDatepicker.min.js 下载 js 文件。

示例

上述示例的输出如下