简体   繁体   English

角度:检查值ng-blur

[英]Angular: check value ng-blur

I'm trying to build a form in Angular, but i'm new with it, so I need some help :) 我正在尝试在Angular中构建表单,但是我是新手,所以我需要一些帮助:)

I have a field 'email' which should be checked when the user leave that field. 我有一个字段“电子邮件”,当用户离开该字段时应进行检查。 A function in my controller should to check the entered value if it already exist in the database (ajax/http). 我的控制器中的功能应检查输入的值(如果它已经存在于数据库中)(ajax / http)。

I found the 'ng-blur' function and have created a function in my controller to check the email. 我找到了“ ng-blur”函数,并在控制器中创建了一个函数来检查电子邮件。 But, the $scope.user.email is undefined, and I don't known what i'm doing wrong. 但是,$ scope.user.email是未定义的,我不知道自己在做什么错。 Can somebody help me? 有人可以帮我吗?

This is my code so far: 到目前为止,这是我的代码:

HTML (jade) HTML(玉器)

p.claim-text Email
abbr.required.claim-text(title='required') *
input#billing_email.input-text.form-control.claim-input(type='email', placeholder='Email', value='', name='email', ng-model='user.email', ng-blur='checkEmail()' required)
p(ng-show="registerForm.email.$invalid && !registerForm.email.$pristine").help-block Invalid emailadres
p(ng-show="emailExists").help-block User exists! Click here to login

Controller function 控制器功能

$scope.checkEmail = function(){
        console.log($scope.user.email);
        $http({
            method: 'GET',
            url: '[someurl]',
            data: $scope.user.email,
        }).then(function successCallback(response){
            //if response is true, set emailExists to true;
        }, function errorCallback(response){

        });

    }

Please try this snipped 请尝试一下

 var myApp = angular.module('myApp',[]); myApp.controller('GreetingController', ['$scope','$http', function($scope, $http) { //You can check POST at server side to get the entered email $scope.checkEmail = function(email){ //REMOVE THIS LINE console.log(email);return false; $http({ method: 'POST', url: '[someurl]', data: email, }).then(function successCallback(response){ //if response is true, set emailExists to true; }, function errorCallback(response){ }); } }]); 
 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <!--HTML --> <div ng-app="myApp" ng-controller="GreetingController"> <input type="text" ng-blur="checkEmail(email)" ng-model="email"/> </div> 

OR
<!--JADE -->
input#billing_email.input-text.form-control.claim-input(type='email', placeholder='Email', name='email', ng-model='user.email', ng-blur='checkEmail(user.email)' ng-init="user.email=''" required)

You can pass the email to checkEmail function 您可以将电子邮件传递给checkEmail功能

input#billing_email.input-text.form-control.claim-input(type='email', placeholder='Email', value='', name='email', ng-model='user.email', ng-blur='checkEmail()' required)

Then in controller you just need to get the email from argument 然后在控制器中,您只需要从参数获取电子邮件

$scope.checkEmail = function(){
        console.log($scope.user.email);
        $http({
            method: 'GET',
            url: '[someurl]',
            data: $scope.user.email,
        }).then(function successCallback(response){
            //if response is true, set emailExists to true;
        }, function errorCallback(response){

        });

    }

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM