2012-08-28 2 views
13

양식의 기본 유효성 검사는 예상대로 작동합니다. 그러나 사용자가 유효한 전자 메일 주소와 최소 3 자의 암호를 입력하면 로그인 자격 증명이 유효한 것은 아닙니다. 서버 측 유효성 검사 양식 Angular.js

그래서 제 질문은 내가 서버 측 유효성 검사를 후 무효로 모델 ' 이메일'와 ' 비밀번호'을 설정하는 방법이기 때문에, 입력 필드는 ng- 대신 클래스 NG-무효를 얻을 수 유효한.

내 현재 코드 :

function IndexCtrl($scope, $http) 
{ 
    $scope.form = {}; 
    $scope.submitLogin = function() 
    { 
    $http.post('/api/auth/login', $scope.form).success(function(data) 
    { 
     if (!data.success) 
     { 
     $scope.form.errors = [ data ]; 

     // here I also want to mark the models 'email' and 'password' as invalid, so they both get the class 'ng-invalid' 
     } 
     else 
     { 
     $location.path('/'); 
     } 
    }); 
    }; 
} 

어떤 도움을 환영합니다 정말 감사합니다. 미리 감사드립니다!

+4

당신은 단순히 $ setValidity 방법을 사용할 수 있습니까? – Tosh

+2

전혀 관련이 없지만 AJAX 호출이 오류를 반환하면 상태 코드를 400으로 설정합니다. 이렇게하면'data.success'를 확인하거나 설정할 필요가 없으며 오류 콜백에서 오류를 처리합니다. – DanH

답변

5

Tosh shimayama이 정답입니다. $ setValidityNgModelController의 메서드이며 validationErrorKeyisValid의 두 매개 변수를 사용합니다.

$ setValidity

변경 유효 상태에 대한 정보, 및 폼 제어 변경의 타당성을 통지한다. (즉, 주어진 유효성 검사기가 이미 유효하지 않은 것으로 표시된 경우 인 경우 양식에 알리지 않습니다).

소스와 여기에서 자세한 내용 AngularJS: NgModelController

3

클라이언트 측 유효성 검사는 빠르지 만, 예를 들면 방화 광구를 사용하여 쉽게 끊을 수 있습니다. 서버 측 유효성 검사 만 수행 할 수 있습니다. 서버의 모든 항목을 확인하고 키 및 오류 메시지 목록을 사용하여 BODY를 반환합니다. Angular를 사용하면 데이터를 서버에 비동기 적으로 보낼 수 있으므로 최종 사용자는 클라이언트 측 유효성 검사로 볼 수 있습니다.

이 예제를 참조하십시오, '저장'을 클릭하고 오류 메시지가 표시하려고 : upida.cloudapp.net:8080/org.upida.example.angular/order/create?clientId=1

당신은 그것을 다운로드 할 수 있습니다 upida.codeplex.com

관련 문제