Angularjs - 720kb.datepicker - Откройте календарь вручную

Question

Я использую 720kb.datepicker для отображения календаря. Я хочу открыть календарь из ссылки вручную.

Это HTML-код:

<datepicker date-format="dd/MM/yyyy"> 
    <input type="text" class="form-control" ng-model="dateBirth" 
     id="date-birth" name="dateBirth" placeholder="DD/MM/YYYY" required maxlength="10" ng-pattern="/^(\d{1,2})\/(\d{1,2})\/(\d{4})$/" 
     validator="isDateofBirthMore" /> 
    <span>open calendar</span> 
</datepicker> 

Я хочу, чтобы открыть календарь, когда я делал Жмите в текст «открытого календаря»

Я пытаюсь сосредоточиться на этой документации, но я не могу получить: http://pythonhackers.com/p/720kb/angular-datepicker

в частности, в этом разделе: вручную показать и скрыть DatePicker

Как можно сделать Это? спасибо,

Answer 1

Вы должны также использовать Datepicker-тумблер в тандеме с Datepicker-шоу. Здесь is my updated plunkr

Я не очень уверен, что они обработали все события, глядя на исходный код. Возможно, вам придется использовать jQuery и $ (window) .on ('blur click', function() {}) и $ ('# spanId'). On ('blur click', function() {}) и т. Д. Для пролет, окно, чтобы полностью работать.

контроллер:

 var app = angular.module('plunker', ['720kb.datepicker']); 

     app.controller('MainCtrl', function($scope, $interval, $window) { 
      $scope.visibility = false; 
      $scope.toggled = false; 


      $scope.toggle = function(){ 
      $scope.visibility = !$scope.visibility; 
      $scope.toggled = !$scope.toggled; 
      } 

     }); 

HTML:

 <datepicker date-format="dd/MM/yyyy" datepicker-toggle="false" datepicker-show="{{ visibility }}"> 
      <!-- Use flag for visibility --> 
      <input type="text" class="form-control" id="date-birth" name="dateBirth" required="" ng-model="dateBirth" placeholder="DD/MM/YYYY" maxlength="10" ng-pattern="/^(\d{1,2})\/(\d{1,2})\/(\d{4})$/" validator="isDateofBirthMore" /> 
      <!-- Set flag = true on click --> 
      <span id="openMe" ng-click="toggle()">open calendar</span> 
     </datepicker> 

Переключение вкл/выкл работает только, нажав на пролете. Вы можете использовать изменение текста диапазона, чтобы читать открывать/закрывать при переключении, если события стрельбы не делают для вас.

Answer 2

Просто используйте флаг для отслеживания видимости:

<datepicker date-format="dd/MM/yyyy" 
      datepicker-show="{{ showDatepicker }}"> <!-- Use flag for visibility --> 
    <input type="text" class="form-control" id="date-birth" name="dateBirth" 
      required 
      ng-model="dateBirth" 
      placeholder="DD/MM/YYYY" 
      maxlength="10" 
      ng-pattern="/^(\d{1,2})\/(\d{1,2})\/(\d{4})$/" 
      validator="isDateofBirthMore" /> 
    <!-- Toggle flag on click --> 
    <span ng-click="showDatepicker = !showDatepicker">open calendar</span> 
</datepicker>