각도로 빈 개체를 할당하는 동안 전자 메일 필드가 재설정되지 않습니다.

Question

각도로 양식을 재설정하는 동안 문제가 있습니다. ABC, XYZ로 형태로 세부 사항을 입력하고 선택 -

HTML

<form name="jay" novalidate class="simple-form"> 
     Name: <input type="text" name="name" ng-model="user.name" /><br /> 
     E-mail: <input type="email" name="email" ng-model="user.email" /><br /> 
     Gender: <input type="radio" ng-model="user.gender" value="male" />male 
     <input type="radio" ng-model="user.gender" value="female" />female<br /> 
     <button ng-click="reset()">RESET</button> 
     <button ng-click="update(user)">SAVE</button> 
    </form> 
    <pre>form = {{user | json}}</pre> 
    <pre>master = {{master | json}}</pre> 

컨트롤러

angular.module('formExample', []) 
     .controller('ExampleController', ['$scope', function($scope) { 
     //$scope.masterReset = {email:""}; 
     $scope.masterReset = {}; 
     $scope.master = {}; 

     $scope.update = function(user) { 
      $scope.master = angular.copy($scope.user); 
     }; 

     $scope.reset = function() { 
      $scope.user = angular.copy($scope.masterReset); 
      //console.log($scope.jay); 
     }; 

     $scope.reset(); 
     }]); 

아래 시도는

1 단계 단계 남성 또는 여성.

2 단계 - 이제 재설정을 클릭하십시오. 이메일에 잘못된 값을 입력했기 때문에 이메일 텍스트 상자가 비어 있지 않음을 알 수 있습니다. 올바른 형식으로 전자 메일을 입력 한 다음 재설정을 클릭하면 3 개의 필드가 모두 재설정됩니다.

Plunker - DEMO

그것은 아래로 작동하지만 우리가 그때는 잘 작동하지만 사용자가되지 않았을 때 나는 빈 객체를 원하는 빈 email 속성 $scope.masterReset 객체를 설정하면 그것을

을 사용할 수 없습니다 세부 사항을 기입하십시오. 또한 개체를 반복하고 비어있는 제거 할 수 있지만 내 양식에 많은 필드가 있으므로 그렇게하고 싶지 않습니다.

왜 예상대로 작동하지 않는지 제안 해주세요.

Answer 1

포스 사용자는 불완전한 이메일 주소를 쓸 때 유효성 검사 오류를 트리거하기 때문에 작동하지 않았다 Link

<form name="jay" novalidate class="simple-form"> 
    Name: <input type="text" name="name" ng-model="user.name" /><br /> 
    E-mail: <input type="email" name="email" ng-model="user.email" /><br /> 
    Gender: <input type="radio" ng-model="user.gender" value="male" />male 
    <input type="radio" ng-model="user.gender" value="female" />female<br /> 
    <button ng-disabled="jay.$invalid" ng-click="reset()">RESET</button> 
    <button ng-disabled="jay.$invalid" ng-click="update(user)">SAVE</button> 
</form> 

를 참조 코드 ng-disabled="jay.$invalid"에 따라 올바른 이메일 주소를 입력합니다. 따라서 유효성 검사를 구현하고 사용자가 전자 메일 주소를 완성하도록 강요하면 입력 유형을 "전자 메일"로 유지할 수 있습니다.

Answer 2

전자 메일이 $scope의 사용자 개체에 설정되어 있지 않기 때문에 그 이유가 있습니다. input 유형을 전자 메일로 설정하면 angularjs이 전자 메일 유효성 검사를 필드에 설정하기 때문입니다. 이제 일반 이메일을 사용하면 코드가 예상대로 작동합니다. 예를 들어

: abc@xyz.com

는 여기에 내가 너무 이메일을 확인하려는 때문에 텍스트로 이메일을 변경할 수 없습니다 링크 https://docs.angularjs.org/api/ng/input/input%5Bemail%5D