2013-03-16 3 views
4

양식에 입력 한 내용이 required tag인데 제대로 작동하지만 제출 버튼에 데이터 제출시 양식을 숨기는 ng-click="visible = false"이 있습니다.각도 JS HTML5 유효성 검사

모든 유효성 검사가 올바른 경우 어떻게 만 false로 설정할 수 있습니까?

$scope.newBirthday = function(){ 

     $scope.bdays.push({name:$scope.bdayname, date:$scope.bdaydate}); 

     $scope.bdayname = ''; 
     $scope.bdaydate = ''; 

    }; 

HTML

App.js :

<form name="birthdayAdd" ng-show="visible" ng-submit="newBirthday()"> 
     <label>Name:</label> 
     <input type="text" ng-model="bdayname" required/> 
     <label>Date:</label> 
     <input type="date" ng-model="bdaydate" required/> 
     <br/> 
     <button class="btn" ng-click="visible = false" type="submit">Save</button> 
     </form> 

답변

4

당신은 FormController에 그 이름으로 가장 가까운 컨트롤러 범위에 노출 될 것입니다 폼에 이름을 부여합니다. 따라서 귀하의 경우는 양식 내부의 입력 요소는 다음 양식이 유효합니다 유효한 경우 컨트롤러

function MyController($scope){ 
    // the form controller is now accessible as $scope.birthdayAdd 

    $scope.onSave = function(){ 
     if($scope.birthdayAdd.$valid){ 
      $scope.visible = false; 
     } 
    } 
} 

이제
<div ng-controller="MyController"> 
    <!-- more stuff here perhaps --> 
    <form name="birthdayAdd" ng-show="visible" ng-submit="newBirthday()"> 
     <label>Name:</label> 
     <input type="text" ng-model="bdayname" required/> 
     <label>Date:</label> 
     <input type="date" ng-model="bdaydate" required/> 
     <br/> 
     <button class="btn" ng-click="onSave()" type="submit">Save</button> 
     </form> 
</div> 

같은 구조 뭔가를 말한다. 희망이 도움이됩니다.