날짜 유효성 검사를위한 angular 지시문

Question

null 입력란에 null 입력을 확인하는 지시문을 작성하고 null 인 경우 현재 날짜로 재설정하십시오. 이 변경 사항을 확인하는 데 문제가 없습니다.

HTML 코드 :

<input type="date" class="form-control" id="birthDate" 
       ng-model="vm.bDate" ng-change="vm.dateValid(vm.bDate)"> 

그리고 컨트롤러의 코드는 : 난 내 응용 프로그램에서 여러 날짜 필드를 갖고 있기 때문에

function dateValid(date) { 
    vm.bDate = date || new Date(); 
} 

이 코드가 작동 완벽하게 정상적으로,하지만 난 어떻게해야합니까 싶습니다 지시어로 정확히 같은 결과. 날짜 내가 예를 들어 올해 지울 때처럼 null의 경우, 내가에 오류가

<input type="date" class="form-control" id="birthDate" valid-date="" 
       ng-model="vm.bDate"> 

그리고 :

$element.on('blur', function() { 
    var pDate = Date.parse($ctrl.$modelValue); 
    if (isNaN(pDate) === true) { 
    $ctrl.$setViewValue(new Date()); 
    $ctrl.$render(); 
    } 
}); 

그리고 HTML :

그래서 나는 지시를 구현 콘솔 :

지정된 값 "Sun Sep 18 2016 21:41:34 GMT + 0300 (예루살렘 일광 절약 시간제)"에 맞지 않습니다. 필요한 형식은 "yyyy-MM-dd"입니다.

날짜 필드를 재설정하는 적절한 방법은 무엇입니까?

고맙습니다

Answer 1

지침 용액 :

app.directive('validDate', function ($timeout) { 
    return { 
    scope: { 
     ngModel: '=' 
    }, 
    bindToController: true, 
    controllerAs: 'vm', 
    link: function (scope, element, attrs, ctrl) { 
     element.on('blur', function() { 
     // using timeout instead of scope.$apply, notify angular of changes 
     $timeout(function() { 
      ctrl.ngModel = ctrl.ngModel || new Date(); 
     }); 
     }); 
    }, 
    controller: function() {} 
    } 
}); 

HTML : 모두 답변

<input type="date" 
     class="form-control" 
     id="birthDate2" 
     ng-model="vm.bDate" 
     valid-date> 

업데이트 plunker : http://plnkr.co/edit/32Ny4rnPreK2dGC5GMFo?p=preview

그러나

JS

소자 ng 내지 블러를 추가 다른 지시자

app.directive('vd', function ($compile) { 
    return { 
    link: function (scope, element) { 
     element.attr('ng-blur', 'vm.dateValid()'); 
     $compile(element)(scope); 
    } 
    } 
}); 

. (. 새 Date() toLocaleDateString()) :

HTML

<input type="date" 
     class="form-control" 
     id="birthDate2" 
     ng-model="vm.bDate" 
     vd> 

plunker http://plnkr.co/edit/U9KtoffbnCXNeAWcWLEC?p=preview

Answer 2

당신은 ng-blur으로 입력을 검증 지침이 필요하지 않습니다 :

HTML

<input type="date" 
     class="form-control" 
     id="birthDate2" 
     ng-model="vm.bDate" 
     ng-blur="vm.dateValid()"> 

JS

app.controller('MainCtrl', function($scope) { 
    var vm = this; 

    vm.bDate = new Date(); 

    vm.dateValid = function() { 
    vm.bDate = vm.bDate || new Date(); 
    } 
}); 

plunker : http://plnkr.co/edit/32Ny4rnPreK2dGC5GMFo?p=preview

에게