2

これは Angular.JS の Email Check 要素コードです ほとんどは問題ありませんが、これには問題があります。メールチェック項目を記入すると、 リセットです！

例 I これを email check 要素に書き込みます。

"test@test.com"

でもこれはリセット！「。」を書くとき ←ポイント。

"test@test" <- OK

「テスト＠テスト」<- 入力をリセットします。「。」を書くとき <-

なぜ問題が発生したのですか？

Javascript

    <script>
angular.module('test', [])
    .controller('MyController', ['$scope', '$window', function($scope, $window) {
        $scope.sendMessage=function(toSb){
            alert(toSb);
        };

    }])
    .directive('emailInput', function($compile) {
        return {            
            restrict: 'C',          
            template: '<input type="email" ng-model="emailtext" required>{{emailtext}}',
            link: function(scope, elem, attrs){
                    scope.name="emailAddress";

                    var input = elem.find("input")[0];
                    input.name = "emailAddress";                                    
                    $compile(input)(scope);


            }
        };
    });
</script>

HTML

<form name="myForm">
<div class="email-input"></div>
inputIsValid={{myForm.emailAddress.$valid}}<br>
<span class="error" ng-show="myForm.emailAddress.$error.required">Required!</span>
<span class="error" ng-show="myForm.emailAddress.$error.email">Not valid email!</span>
</form>
4

1 に答える 1

1

ディレクティブを置換オプションで作成し、ディレクティブ要素から name 属性を取得する必要があります (基本的に、入力を再度コンパイルしないでください)。これは、ディレクティブをコンパイルしたときに奇妙な動作を示す角度検証であり、解析後に modelValue (未定義) をリセットしますが、この場合、viewvalue もリセットします。入力型を直接使用すると発生しないことがわかります。テンプレートの再コンパイルがこの問題を引き起こしているようです。

.directive('emailInput', function ($compile) {
    return {
        restrict: 'C',
        replace:true,
        template: '<input type="email"  ng-model="emailtext" required>',
        link: function (scope, elem, attrs) {

        }
    };

と

<div class="email-input" name="emailAddress"></div>

プランク

于 2014-08-30T03:20:34.423 に答える