angular-ui datepicker początkowy stan datepicker nie sformatowany na datepicker-popup

Question

Pracuję z datepicker kątowy-ui i wszystko działa poprawnie, z wyjątkiem stanu początkowego datepicker. Po wybraniu daty wygląda dobrze. Patrz poniżej:

Stan początkowy

Po wybraniu daty w selektorze

więc wyraźnie Otrzymuję strigified wersję obiekt daty w pierwszym przypadku i sformatowany po wybraniu daty.

znaczników

<input type="text" class="form-control" 
     id="birthday" 
     datepicker-options="datePickerOptions" 
     datepicker-popup="{{format}}" 
     data-ng-model="birthday" 
     data-is-open="opened" 
     data-ng-required="true" 
     data-close-text="Close"/> 

<span class="input-group-btn"> 
    <button type="button" 
      class="btn btn-default" 
      data-ng-click="open($event)"> 
     <i class="fa fa-calendar"></i> 
    </button> 
</span> 

Kontroler

var today = $scope.today = function today() { 
    $scope.birthday = $scope.client.birthday || new Date(); 
}; 
today(); 

$scope.clear = function clear() { 
    $scope.dt = null; 
}; 

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

    $scope.opened = true; 
}; 

$scope.format = 'MMM d, yyyy'; 
$scope.datePickerOptions = { 
    'show-weeks': false 
}; 

Nie jest to wielka sprawa, ale byłoby naprawdę miło, gdyby model (który musi być data obiekt za docs) został sformatowany zgodnie z $scope.format na początku, a nie jako obiekt o określonym znaczeniu. Ponadto, nie jesteśmy pewni, że to robi różnicę, ale ten datepicker jest wewnątrz modalu. Dzięki za pomoc!

UPDATE

Wygląda na to, że nie jestem jedynym, doświadcza tego, a jest to związane z użyciem kątowe 1.3. https://github.com/angular-ui/bootstrap/issues/2659

Answer 1

Innym obejść, że pracował dla mnie, poza tym taka jak opisana w kwestii github, ma zainicjować modelu z czasem epoki w milisekundach, a nie obiekt daty, np

$scope.dt = new Date().getTime(); 

Answer 2

miałem podobny problem, wygląda jak bootstrap UI jest niezgodna z wersją angularjs 1.3.x

Ten plunkr rozwiązuje problem dla mnie http://plnkr.co/edit/L9u12BeeBgPC2z0nlrLZ?p=preview

// this is the important bit: 
.directive('datepickerPopup', function(){ 
    return { 
    restrict: 'EAC', 
    require: 'ngModel', 
    link: function(scope, element, attr, controller) { 
     //remove the default formatter from the input directive to prevent conflict 
     controller.$formatters.shift(); 
    } 
    } 
}); 

odnoszą się także do biletu GitHub https://github.com/angular-ui/bootstrap/issues/2659#issuecomment-60750976

Answer 3

Gdzie/gdziekolwiek znalazłem rozwiązania są długotrwałe, obsługi dyrektywą itd. Więc wolę ten krótki jeden

birthday = $filter('date')(new Date(), "MMM dd, yyyy"); 

Uwaga: Nie zapomnij, aby wstrzyknąć kątowe wybudowany w $ filter serwisu do sterownika

angular.module('app').controller("yourController", 
['$filter' function($filter){ 
     /* your code here */ 

     birthday = $filter('date')(new Date(), "MMM dd, yyyy"); 

     /* your code here */ 
}]); 

Mam nadzieję, że to pomoże.

Answer 4

By poprawić odpowiedzi Premchandra Singha, używając kątową $ serwis filtr działa, ale trzeba też dodać zegarek na datę dziedzinie zastosować filtr na przyszłych aktualizacji:

$scope.myDate = $filter('date')(new Date(), 'dd.MM.yy'); 
$scope.$watch('myDate', function (newValue, oldValue) { 
    $scope.myDate = $filter('date')(newValue, 'dd.MM.yy'); 
});