title: Angularjs UI bootstrap Datepicker
body: <p>I am using Angularjs datepicker in my application. I want to display selected date in UI. It should display "Selected Date:dd/MM/yyyy" which is working correctly. But If I select today's date it should display "Today:dd/MM/yyyy".
  But for today's date also it is showing "Selected Date:dd/MM/yyy". Can anyone please help me .
  my html code.</p>
  
  <pre><code>&lt;div ng-controller="DatepickerDemoCtrl"&gt;
  Selected date is: {{dt | date:'dd/MM/yyyy' }}
  &lt;div &gt;
      &lt;div &gt;
            &lt;div&gt;
  
              &lt;button type="button" class="btn btn-default" 
              datepicker-popup="{{format}}" ng-model="dt" 
              is-open="status.opened" min-date="minDate" show-weeks="false" show-button-bar="false"
              max-date="maxDate" datepicker-options="dateOptions" 
              date-disabled="disabled(date, mode)" ng-required="true" 
              close-text="Close"  ng-click="open($event)"&gt;
                &lt;img src="calendar.png" /&gt;&lt;/button&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>
  </p>
  
  <p>JS code</p>
  
  <pre><code> var app= angular.module('myApp', ['ui.bootstrap']);
   app.controller('DatepickerDemoCtrl', function ($scope) {
   $scope.today = function() {
   $scope.dt = new Date();
   };
   $scope.today();
  $scope.refresh = function(){
  $scope.dt = new Date();
  };
  
  $scope.maxDate  = new Date(new Date().setDate(new Date().getDate()));
  $scope.minDate  = new Date(new Date().setDate(new Date().getDate()-7));
  
  $scope.open = function($event) {
  $event.preventDefault();
  $event.stopPropagation();
  $scope.status.opened = true;
  
  };
  
  $scope.setDate = function(year, month, day) {
  $scope.dt = new Date(year, month, day);
  };
  
  $scope.dateOptions = {
  formatYear: 'yy',
  startingDay: 1
  };
  
  
  
  $scope.status = {
   opened: false
  };
  
  });
  </code></pre>