angularjs 양식 내부 양식이있는 유효성 확인

Question

일부 입력 양식이 있습니다. 몇 시간 동안이 양식에 입력 한 다른 양식이 있습니다. 내부 양식이 없을 때 상위 양식이 유효하지만 내부 양식이 원본 양식과 원본 양식 (올바른 입력 내용이 있음)이 유효하고 내부 양식이 유효하지 않은 경우 원본 양식도 유효하지 않습니다. submit1을 클릭하면 원래 형식으로 입력을 저장해야하며 submit2를 클릭하면 내부 입력을 저장해야합니다.

웹 양식에서 우리는 유효성을 그룹화했습니다. 이 경우에 대한 각 유효성 검사에서 webform으로 그룹화 했습니까? 당신이 ng-form 문서를 참조 자세한 내용에 대한 form 내부 forms를 중첩하는 경우

<form name="original" novalidate class="form-horizontal bv-form"> 
    <div class="col-md-3 col-sm-6" ng-class="{ 'has-error': !original.name.$pristine && original.name.$invalid ,'has-success':!original.name.$invalid}"> 
    <label>Name</label> 
    <input auto-focus class="form-control" type="text" name="name" ng-model="vm.original.name" required /> 
    <i class="form-control-feedback glyphicon" ng-class="{ 'glyphicon-ok' : original.name.$dirty && original.name.$valid , 'glyphicon-remove': original.name.$dirty && original.name.$invalid}" data-bv-icon-for="firstName" ng-show="original.name.$dirty"> 
    </i> 
    <div> 
    <span class="help-block " ng-show="original.name.$invalid && !original.name.$pristine"> 
    name required 
    </span> 
    </div> 
    </div> 
<form name="internal" novalidate class="form-horizontal bv-form"> 
<div class="col-md-3 col-sm-6" ng-class="{ 'has-error': !internal.name.$pristine && internal.name.$invalid ,'has-success':!internal.name.$invalid}"> 
    <label>Name</label> 
    <input auto-focus class="form-control" type="text" name="name" ng-model="vm.internal.name" required /> 
    <i class="form-control-feedback glyphicon" ng-class="{ 'glyphicon-ok' : internal.name.$dirty && internal.name.$valid , 'glyphicon-remove': internal.name.$dirty && internal.name.$invalid}" data-bv-icon-for="firstName" ng-show="internal.name.$dirty"> 
    </i> 
    <div> 
    <span class="help-block " ng-show="internal.name.$invalid && !internal.name.$pristine"> 
    name required 
    </span> 
    </div> 
    </div> 
<button type="submit" id="submit2" class="btn btn-primary blue" ng-click="int=internal.$valid && $scope.save2()"> 
</form> 
<button type="submit" id="submit1" class="btn btn-primary blue" ng-click="original.$valid && $scope.save()"> 
</form> 

Answer 1

내 해결책을 찾았습니다.

이 경우 외부 양식을 제출할 때 내부 양식에 대한 유효성 검사를 방지하기 위해 ng-if을 사용합니다.

클라이언트가 외부 양식에서 작업하는 경우 내부 양식을 숨기고 외부 양식을 제출할 수 있습니다. 고객이 내부 양식을 제출하려고 시도 할 때이를 고객에게 보여주고 유효성을 내부 양식 입력 및 제출할 수 있습니다.

Answer 2

당신은 ng-form 대신 form 사용해야합니다.

양식 지시문의 중첩 가능한 별칭. HTML은 양식 의 중첩을 허용하지 않습니다. 예를 들어 통제 그룹의 유효성을 결정해야하는 경우와 같이 서식을 중첩하는 것이 유용합니다.