AngularJS와 검증 문제

나는 AngularJS와 지시어를 사용하여 양식 productForm 유효성을 검사 할, 그래서 시도 :이 방법으로AngularJS와 검증 문제

<form id="productForm" name="productForm" novalidate> 
    <div style="width: 100%; margin-top: 15px; float: right; "> 
       <label style="width:103px;float:right" class="col-sm-2" for="ProductName">ProductName: </label> 

       <div style="float:right" class="col-sm-5"> 
        <input ng-required="true" class="form-control" style="float:right" type="text" id="ProductName" name="ProductName" ng-model="modal.ProductName" value="" /> 
       </div> 
       <div style="float:right" class="col-md-7" > 
        <span class="help-block" ng-if="productForm.ProductName.$error.required && productForm.ProductName.$dirty && productForm.ProductName.$touched "> Name is Must</span> 
       </div> 

    </div> 
    <button class="btn" style="background-color: #ed9c28;" type="button" ng-click="Save()" ng-disabled="productForm.$invalid">Save</button> 
</form>

문제가 : 사용자가 ProductName을 터치 한 후 포커스를 잃었을 때, 필요한 메시지를 표시되지 않았습니다 (입력시 사용자 유형을 입력 한 다음 입력에서 전체 텍스트를 지울 때 표시되지만 입력이 비어있을 때 오류 메시지가 표시됨). productForm.ProductName.$touched을 사용하려고 시도합니다. 수행 할 오류 메시지는 ng-if입니다. 하지만 작동하지 않습니다. 어떻게 할 수 있습니까?

출처

2016-07-31 pejman

이렇게 무슨 일이 일어나고 있는지 이해하기 :'

' – developer033

나는 더러운 $에 대한 검사를 생략하고 대신 $invalid 및 $touced를 확인합니다 :

ng-if="productForm.ProductName.$invalid && productForm.ProductName.$touched"

출처

2016-07-31 16:00:36

그것은 답이 아니다. 'ngShow'와'ngIf'는이 경우 모두 작동합니다 (어떤 경우에도'ngShow'를 사용하지 않아도됩니다). – developer033

@ developer033 어떤 경우에도 사용해야합니까? 해결 방법은 더러운 체크와 노트를 생략하는 것입니다. ng-show는 힌트 일뿐입니다. 하지만 어쩌면 당신은 저를 납득시킬 수 있습니다 ... –

글쎄,'ngShow'는 나쁜 습관으로 간주됩니다. 'ngIf'가 권장되지만'ngShow'를 사용할 수 있습니다. 나는 그의 문제가 'ngIf'가 아니라는 것을 여기서 지적하고있다. – developer033

AngularJS와 검증 문제

답변

관련 문제