angular日历插件---- angular-daterangepicker

在开发中经常需要用的日期的选择,这里介绍一下 angular-daterangepicker的用法
第一步:使用bower安装
bower install angular-daterangepicker --save
第二步:在html中引入

<script src="bower_components/angular-daterangepicker/js/angular-daterangepicker.min.js"></script>
<script src="bower_components/bootstrap-daterangepicker/daterangepicker.js"></script>
<script src="bower_components/moment/moment.js"></script>
    <link href="bower_components/bootstrap-daterangepicker/daterangepicker.css" rel="stylesheet">

第三步:声明依赖

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

第四步:在controller中初始化

exampleApp.controller('TestCtrl', function ($scope) {
    $scope.datePicker.date = {startDate: null, endDate: null};
}

第五步:在html中添加属性即可

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

原文:https://github.com/fragaria/angular-daterangepicker#mind-the-dot

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容