2016-11-18 4 views
1

Я работаю с выбором даты, используя Angular UI Bootstrap Datepicker. Моя задача - установить по умолчанию поле ввода сборщика даты в пустое поле.Как установить Угловой UT Bootstrap Datepicker для установки пустого поля по умолчанию?

Позвольте мне показать поле ввода, которое я использовал.

<td> 
    <div> 
    <input class="form-control" type="text" datepicker-popup="dd/MM/yyyy" id='txtDate' ng-model="personalDetail.date" is-open="personalDetail.isOpen" close-text="Close" ng-click="open($event, personalDetail)" name="datefilter" value="" /> 

    </div> 
</td> 

И мой сценарий

$scope.personalDetails.forEach(function(personalDetail){ 
    personalDetail.date = new Date(personalDetail.date); 
    }); 

    $scope.open = function($event, personalDetail) { 
    $event.preventDefault(); 
    $event.stopPropagation(); 

    personalDetail.isOpen = true; 
    }; 

Я использую его в HTML-таблицу с нг-повтора. Но мне нужно показать поле даты пустым, пока я не установил соответствующую дату. Пожалуйста, помогите мне в этом.

+0

Вы привязываете элемент управления к полю personalDetail.date, чтобы он отображал любую дату, присутствующую в этом значении. Значение параметра = "", вероятно, не будет работать. – Nick

ответ

2
<td> 
    <div> 
    <input class="form-control" type="text" datepicker-popup="dd/MM/yyyy" id='txtDate' ng-model="personalDetail.date" is-open="personalDetail.isOpen" close-text="Close" ng-click="open($event, personalDetail)" name="datefilter" value="" /> 

    </div> 
</td> 

Ваш контроллер должен быть

$scope.personalDetails.forEach(function(personalDetail){ 
    //personalDetail.date = new Date(personalDetail.date);//sets the value to the control 
    personalDetail.date = !personalDetail.date || new Date(personalDetail.date).toISOString() == new Date('1/1/1900').toISOString() 
     ? '' // Date is null, undeclared, or default value 
     : new Date(personalDetail.date); 
    }); 

    $scope.open = function($event, personalDetail) { 
    $event.preventDefault(); 
    $event.stopPropagation(); 

    personalDetail.isOpen = true; 
    }; 
+0

Спасибо, что очень хорошо работает –

+0

@anilchean :) Рад помочь вам! btw, можете ли вы поделиться ur fb id? – Aravind

+0

Стоит сказать, что проблемы возникнут, если вам нужно будет использовать директиву datepicker внутри формы с проверкой. Угловой UI datepicker не принимает пустую модель как правильную, и поэтому форма будет недействительной. Я столкнулся с этой проблемой, когда мой datepicker был * optional * и не был инициализирован до даты внутри формы. – Francesco

1

Изменение от

personalDetail.date = new Date(personalDetail.date);

в

personalDetail.date = ""; 

как $scope.personalDetail={ date: "" }

 Смежные вопросы

  • Нет связанных вопросов^_^