angulaire.js - Après qu'AngularJS ait utilisé une instruction de validation de formulaire personnalisée, le contenu d'entrée n'est pas soumis ?
phpcn_u1582
phpcn_u1582 2017-05-15 16:57:43
0
1
571

Le code de commande est le suivant :

 var regex = /[\u4e00-\u9fa5\u3400-\u4db5\ue000-\uf8ff]/;
    app.directive("ifHanzi", function () {
        return {
            restrict: "A",
            scope:true,
            require: "ngModel",
            link: function (scope, ele, attrs, ngModelController) {
                ngModelController.$parsers.unshift(function (input) {
                    if (regex.test(input)) {
                        ngModelController.$setValidity('ifHanzi', true);
                    } else {
                        ngModelController.$setValidity('ifHanzi', false);
                    }
                });
            }
        }
    });

Le code html est le suivant :

<form name="iForm" ng-submit="Search(Input)">
    <p class="input-group">
        <input type="text" class="form-control" ng-model="Input" name="inputText" if-hanzi>
        <button class="btn btn-primary" type="submit>查询</button>                        
    </p>
    <span ng-show="iForm.inputText.$error.ifHanzi">提示:只能输入汉字进行查询!</span>
</form>

Code du contrôleur :

app.controller('testCtrl',['$scope',function($scope){
    $scope.Search=function(Input){
        console.log(Input);//使用了表单验证指令后,Input就成了undefined
    }
}]);

La vérification peut être exécutée normalement, c'est-à-dire que tant que j'ajoute l'instruction "ifHanzi" écrite par moi-même, le contenu soumis du formulaire ne peut pas être obtenu dans le contrôleur et devient indéfini. Mon instruction est-elle mal écrite ou est-elle incorrecte ? il y a autre chose ? Si je n'ai rien remarqué, j'espère que les étudiants pourront me donner quelques indications. Merci.

phpcn_u1582
phpcn_u1582

répondre à tous(1)
过去多啦不再A梦

Supprimez simplement le scope = true dans la commande. Vous utilisez un scope indépendant. Le dortoir est déconnecté, vous devez donc utiliser votre téléphone portable...


Mise à jour : 2015-12-13

1. Tout d'abord, parce que ce que vous require est une directive, c'est-à-dire ngModel, et que cette directive n'a pas de portée d'isolation, si vous définissez scope = true, cela provoquera le de ne pas pouvoir mettre à jour l'externe . ngModelC'est le point clé qui conduit au problème ci-dessusngModel. Supprimez donc simplement cette option de configuration. 2. La méthode de fonction que vous avez transmise à n'a pas renvoyé le résultat après vérification de
, ce qui a entraîné la non-transmission de la valeur de la vue au modèle. Il peut être modifié comme suit : ngModel.$parsers

    if (regex.test(input)) {
        ngModelController.$setValidity('ifHanzi', true);
        return input; /* return the input */ 
    } else {
        ngModelController.$setValidity('ifHanzi', false);
    }
ifHanziC'est la deuxième cause du problème

. J'espère que cela vous aidera.

Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal