Angular JS - 오염되지 않은 것과 만져지지 않은 것의 차이
AngularJS Developer Guide - Forms(양식)에는 양식과 필드에 관한 다양한 스타일과 지시사항이 나열되어 있습니다.각 CSS 클래스:
ng-valid
ng-invalid
ng-pristine
ng-dirty
ng-touched
ng-untouched
와의 차이는 무엇입니까?pristine/dirty
,그리고.touched/untouched
?
AngularJS Developer Guide - Angular에서 사용하는 CSS 클래스JS
- @property {boolean} $untouched 컨트롤이 아직 포커스를 잃지 않은 경우 True입니다.
- @property {boolean} $touched 컨트롤이 포커스를 잃었을 경우 True입니다.
- @property {boolean} $pris틴 사용자가 아직 컨트롤과 상호 작용하지 않은 경우 True입니다.
- @property {boolean} $dirty 사용자가 컨트롤과 이미 상호 작용한 경우 True입니다.
$pristine
/$dirty
사용자가 실제로 변경했는지 아닌지를 나타냅니다.$touched
/$untouched
에, 유저가 단지 거기에 있었는지 아닌지를 나타냅니다.
이것은 검증에 매우 유용합니다.이유$dirty
는, 유저가 실제로 특정의 컨트롤에 액세스 할 때까지, 항상 검증 응답을 표시하지 않는 것입니다.단, 이 명령어만 사용하여$dirty
사용자는 실제로 값을 변경하지 않는 한 검증 피드백을 받을 수 없습니다.그래서...$invalid
사용자가 값을 변경하거나 변경하지 않으면 필드에 프롬프트가 표시되지 않습니다.사용자가 단순히 필수 필드를 무시하고 탭으로 표시하면 제출하기 전까지 모든 것이 정상으로 표시됩니다.
Angular 1.3 및ng-touched
이제 사용자가 값을 실제로 편집했는지 여부에 관계없이 사용자가 방문한 후 흐릿해지면 바로 컨트롤에 특정 스타일을 설정할 수 있습니다.
여기 행동 차이를 보여주는 CodePen이 있습니다.
Pro Angular-6의 상세한 내용은 다음과 같습니다.
- valid: 요소의 내용이 유효하면 true를 반환하고 그렇지 않으면 false를 반환합니다.
무효:이 속성은 요소의 내용이 올바르지 않으면 true를 반환하고 그렇지 않으면 false를 반환합니다.
원래대로:요소의 내용이 변경되지 않은 경우 이 속성은 true를 반환합니다.
- dirty: 요소의 내용이 변경된 경우 이 속성은 true를 반환합니다.
- 손대지 않음:사용자가 요소를 방문하지 않은 경우 이 속성은 true를 반환합니다.
- 터치:사용자가 요소를 방문한 경우 이 속성은 true를 반환합니다.
늦은 답변이지만 도움이 되길 바랍니다.
시나리오 1: 사이트를 처음 방문하여 어떤 필드도 건드리지 않았습니다.형상이란
ng-syslog 및 ng-syslog
시나리오 2: 현재 폼의 특정 필드에 값을 입력하고 있습니다.그럼 상태는
ng-syslog 및 ng-syslog
시나리오 3: 필드에 값을 입력하고 다음 필드로 이동했습니다.
ng-syslog 및 ng-syslog
시나리오 4: 폼에 전화번호 필드가 있다고 가정합니다.번호는 입력했지만 실제로는9자리이지만 전화번호에는 10자리가 필요합니다.그러면 상태는 ng-invalid가 됩니다.
요컨대:
ng-syslog:양식 필드를 아직 방문하지 않은 경우
ng-syslog:양식 필드를 방문했을 때 필드의 포커스를 잃었을 때
ng-syslog:양식 필드 값은 변경되지 않습니다.
ng-syslog:폼 필드 값이 변경되었습니다.
ng-valid : 폼필드의 모든 검증이 성공한 경우
ng-syslog:양식 필드의 유효성 검사에 성공하지 못한 경우
검증 속성은 양식 및 양식 요소에 따라 다르다는 점을 언급할 필요가 있습니다(터치 및 비터치는 필드만 해당).
Input fields have the following states: $untouched The field has not been touched yet $touched The field has been touched $pristine The field has not been modified yet $dirty The field has been modified $invalid The field content is not valid $valid The field content is valid They are all properties of the input field, and are either true or false. Forms have the following states: $pristine No fields have been modified yet $dirty One or more have been modified $invalid The form content is not valid $valid The form content is valid $submitted The form is submitted They are all properties of the form, and are either true or false.
언급URL : https://stackoverflow.com/questions/25025102/angularjs-difference-between-pristine-dirty-and-touched-untouched
'source' 카테고리의 다른 글
Yoast SEO 플러그인에 의해 추가된 rel canical을 제거하는 중 (0) | 2023.03.15 |
---|---|
단위 테스트 각도templateUrl이 있는 JS 디렉티브 (0) | 2023.03.15 |
JSON, REST, SOAP, WSDL 및 SOA: 이 모든 것을 함께 연결하는 방법 (0) | 2023.03.15 |
XML 태그 속성을 JSON으로 어떻게 표현합니까? (0) | 2023.03.10 |
Visual Studio 2015 JSX/ES2015 구문 강조 (0) | 2023.03.10 |