양식 필드에 대한 유효성 적용

간단한 양식 작성 중 하나 또는 두 필드가 공백으로 남겨지면 양식 결과를 배열에 저장하고 이름과 성을 모두 업데이트하려는 경우 경고 메시지를 던져야합니다. 그리고 배열은 빈 값을 저장해서는 안되며 클라이언트 측에서 처리하려고합니다. 나는 그들을 저장하기 전에 입력 값을 검사하는 방법에 대해 혼란스러워합니다. 양식 필드에 대한 유효성 적용

var app = angular.module('myApp', []); 
 
app.controller('formCtrl', function($scope) { 
 
    $scope.ele = []; 
 
    $scope.updateDetails = function(ele) { 
 
    if (!ele.firstname && !ele.lastname) { 
 
     alert("Ele cannot be empty"); 
 
    } else { 
 
     ele.push({ 
 
     'firstname': '', 
 
     'lastname': '' 
 
     }); 
 
     alert(ele.firstname + " " + ele.lastname); 
 
    } 
 
    console.log(ele); 
 
    }; 
 

 
});

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>JS Bin</title> 
 
</head> 
 

 
<body ng-app="myApp"> 
 
    <div ng-controller="formCtrl"> 
 
    <div> 
 
     First Name: 
 
     <input type="text" ng-model="ele.firstname"> 
 
     </br> 
 
     Last Name: 
 
     <input type="text" ng-model="ele.lastname"> 
 
     <br/> 
 
     <input type="button" value="Submit" ng-click="updateDetails(ele)"> 
 
    </div> 
 
    </div> 
 
</body> 
 

 
</html>

출처

2016-06-28 Ritu K

문제의 코드 자체를 추가하십시오. –

'ng-pristine','ng-dirty','ng-valid','ng-invalid'를 사용합니다. –

사용 https://jsbin.com/guduwakeji/edit?html,js,output

나는이 방법을 알아낼이 코드

검증하는

var app = angular.module('myApp', []); 
app.controller('formCtrl', function($scope) { 
    $scope.ele={}; 
    $scope.updateDetails = function(ele){ 
    if(ele.firstname && ele.lastname) 
    { console.log(ele);} 
     else{ 
     alert("empty field not allowed"); 
     } 
    }; 

});

출처

2016-06-28 06:50:17 uzaif

예, 이것도 저에게 적용됩니다. 고맙습니다. 하지만 난이 의심, 우리는 또한 입력 된 필드 오른쪽에 필요한 특성을 사용할 수 있습니까? 모델 검증과 함께. –

그 html 양식이 필요하지 않기 때문에 작동하지 않습니다. html 형식으로 만 작동합니다. – uzaif