AngularJS Simple Datepicker Directive Example Tutorial

By Hardik Savani October 20, 2023 Category : Angular

In this example you implement datepicker directive simply. In this example i used ngDatepicker plugin. It is very simple way to use and integrate. It is very flexible you can set format and other option. So If you also want to add datepicker then can do like as bellow example.

In this example i include /css/ngDatepicker.css path on link so you can download css file from here : Click Here and Also i include /js/ngDatepicker.min.js script tag so you can download js file from here : Click Here


<html lang="en-US">

<link rel="stylesheet" href="">

<link rel="stylesheet" href="">

<link rel="stylesheet" href="/css/ngDatepicker.css">

<script src=""></script>

<script src=""></script>

<script src="/js/ngDatepicker.min.js"></script>


<div ng-app="myApp" ng-controller="customersCtrl">

<h2 class="text-center">Angularjs Simple Datepicker directive example code with Demo



<ng-datepicker ng-model="ctrl.date2" view-format="DD-MM-YYYY">





var app = angular.module('myApp', ['jkuri.datepicker']);

app.controller('customersCtrl', function($scope, $http) {





I hope it can help you...

Tags :