AngularJS에서 ng-pris틴과 ng-dirty의 차이점은 무엇입니까?

AngularJS에서 ng-pris틴과 ng-dirty의 차이점은 무엇입니까?

와의 차이점은 무엇입니까?ng-pristine그리고.ng-dirty둘 다 할 수 있을 것 같아true:

$scope.myForm.$pristine = true; // after editing the form

그ng-dirtyclass는 사용자에 의해 폼이 변경되었음을 알립니다.ng-pristineclass는 사용자가 양식을 수정하지 않았음을 알려줍니다.그렇게ng-dirty그리고.ng-pristine같은 이야기의 양면입니다.

클래스는 임의의 필드에 설정되지만 폼에는 두 가지 속성이 있습니다.$dirty그리고.$pristine.

를 사용할 수 있습니다.$scope.form.$setPristine()폼을 초기 상태로 리셋하는 기능(이는 AngularJS 1.1.x 기능임을 유의하십시오).

필요한 경우$scope.form.$setPristine()AngularJS의 1.0.x 브랜치에서도, 독자적인 솔루션을 전개할 필요가 있습니다(이쪽에서 꽤 좋은 솔루션을 찾을 수 있습니다).기본적으로 이는 모든 양식 필드에 대해 반복하고 해당 필드를 설정하는 것을 의미합니다.$dirty에 깃발을 올리다.false.

pairit 필드는 아직 버진이며 dirty는 사용자가 관련 필드에 이미 입력했는지 여부를 나타냅니다.

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script>
<form ng-app="" name="myForm">
  <input name="email" ng-model="data.email">
  <div class="info" ng-show="myForm.email.$pristine">
    Email is virgine.
  </div>
  <div class="error" ng-show="myForm.email.$dirty">
    E-mail is dirty
  </div>
</form>

단일 키 다운 이벤트를 등록한 필드는 더 이상 버진(더 이상 깨끗하지 않음)이 아니므로 영원히 더럽습니다.

두 지시문은 분명히 같은 목적을 가지고 있으며, 양쪽을 포함하기로 한 각도 팀의 결정이 DRY 원칙을 방해하고 페이지의 페이로드에 추가되는 것처럼 보이지만, 여전히 둘 다 주변에 있는 것이 실용적이다.css 파일에는 .ng-pristern과 .ng-dirty를 모두 스타일링할 수 있기 때문에 입력 요소의 스타일링이 용이합니다.이것이 두 가지 지시를 모두 추가한 주된 이유라고 생각합니다.

이전 답변에서 이미 언급했듯이,ng-pristine는 필드가 변경되지 않았음을 나타냅니다.ng-dirty수정되었음을 알리기 위한 것입니다.왜 둘 다 필요하죠?

필드 사이에 전화와 이메일 주소가 있는 양식이 있다고 칩시다.전화 또는 이메일이 필요합니다.또한 각 필드에 비활성 데이터가 있는 경우에도 사용자에게 통지해야 합니다.이것은, 다음과 같이 실시할 수 있습니다.ng-dirty그리고.ng-pristine함께:

<form name="myForm">
    <input name="email" ng-model="data.email" ng-required="!data.phone">
    <div class="error" 
         ng-show="myForm.email.$invalid && 
                  myForm.email.$pristine &&
                  myForm.phone.$pristine">Phone or e-mail required</div>
    <div class="error" 
         ng-show="myForm.email.$invalid && myForm.email.$dirty">
        E-mail is invalid
    </div>

    <input name="phone" ng-model="data.phone" ng-required="!data.email">
    <div class="error" 
         ng-show="myForm.phone.$invalid && 
                  myForm.email.$pristine &&
                  myForm.phone.$pristine">Phone or e-mail required</div>
    <div class="error" 
         ng-show="myForm.phone.$invalid && myForm.phone.$dirty">
        Phone is invalid
    </div>
</form>

ng-interface(ng-interface. ($140)

양식/입력(사용자가 수정하지 않은 경우)이 Boolean True입니다.

ng-interface(ng-interface. ($140)

Boolean True(양식/입력 사용 시)

---

$setDirty(); 폼을 더티 상태로 설정합니다.이 메서드를 호출하여 'ng-dirty' 클래스를 추가하고 형식을 더티 상태(ng-dirty 클래스)로 설정할 수 있습니다.이 메서드는 현재 상태를 부모 양식에 전파합니다.

$setPristin(); 폼을 원래 상태로 설정합니다.이 메서드는 폼의 $pris틴 상태를 true로 설정하고 $dirty 상태를 false로 설정하고 ng-dirty 클래스를 삭제하고 ng-pris틴 클래스를 추가합니다.또한 $submitted 상태를 false로 설정합니다.이 메서드는 이 양식에 포함된 모든 컨트롤에도 전파됩니다.

폼을 저장 또는 리셋한 후 폼을 '재사용'하려는 경우 폼을 원래 상태로 되돌리는 것이 유용합니다.

언급URL : https://stackoverflow.com/questions/18073230/in-angularjs-whats-the-difference-between-ng-pristine-and-ng-dirty