각도 입력으로 양식 입력 유효성 검사

Question

모든 입력이 채워지지 않은 경우 버튼을 비활성화하려고합니다. 채워져 있으면 버튼이 활성화됩니다.

입력란에 텍스트가 없으면 사용자가 비활성화 된 버튼을 클릭 할 때만 입력 텍스트 아래에 텍스트를 인쇄하려고합니다.

내 질문

어떻게 텍스트가 모든 입력 필드에 존재하면 내 버튼을 사용하려면 코드를 변경 않으며, 그렇지 않은 경우로 비활성화 버튼을 사용자가 클릭은

<div ng-if="!myForm.Lname.$invalid"> 
    <p>This field is required</p> 
</div> 

을 보여 입력란에 텍스트가없는 경우에만

입니다.

당신은 당신의 자신의 지시를 작성하여이 작업을 수행 할 수 있습니다

<div class="form-group"> 
    <label for="first-name">First Name*</label> 
    <input type="text" class="form-control" name="Fname" placeholder="Enter first name" ng-model="formData.Fname" ng-required="true"> 
    <div ng-if="!myForm.Fname.$invalid"> 
     <p>This field is required</p> 
    </div> 
</div> 

<div class="form-group"> 
    <label for="last-name">Last Name*</label> 
    <input type="text" class="form-control" name="Lname" placeholder="Enter last name" ng-model="formData.Lname" ng-required="true"> 
    <div ng-if="!myForm.Lname.$invalid"> 
     <p>This field is required</p> 
    </div> 
</div> 

<div class="form-group"> 
    <label for="email">Email*</label> 
    <input type="email" class="form-control" name="email" placeholder="Enter a valid email address" ng-model="formData.email" ng-required="true"> 
</div> 

<div class="form-group row"> 
    <div class="col-xs-6 col-xs-offset-3"> 

     <button ui-sref="form.select" class="btn btn-block btn-info" ng-disabled="!myForm.Fname.$valid"> 
      Next Section <span class="glyphicon glyphicon-circle-arrow-right"></span> 
     </button> 

    </div> 
</div> 

Answer 1

FULL CODE. 도움이되기를 바랍니다.

여기 Jsfiddle

HTML에 대한 데모는 다음과 같습니다

<div ng-app="sampleapp"> 
<div ng-controller="samplecontoller" ng-init="showData()"> 
<form name="form" disable-btn ng-submit="submitForm()"> 
    <div> 
    <label>First Name:</label> 
    <input type="text" placeholder="First Name" ng-model="model.name" required> 
    </div> 
    <div> 
    <label>Last Name:</label> 
    <input type="text"placeholder="Last Name" ng-model="model.lname" required> 
    </div> 
    <div> 
    <button class="btn btn-primary" type="submit">Submit</button> 
    </div> 
</form> 
</div>