Angular js未定义的函数

时间:2017-03-16 13:32:35

标签: angularjs

我创建了一个发送电子邮件的模式。我正在检查输入以进行验证。但是我得到了未定义的函数错误。错误代码是:

  

ReferenceError:未定义validateEmail

我添加了angularjs脚本。 Ng-app已启动。另外,如何使用ng-if语句显示错误。

模态代码

<div id="contact" class="modal fade" role="dialog" name="contact" ng-controller="mailController">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title"><span class="glyphicon glyphicon-phone-alt" style="color:#D9534F"></span> Contact Us?</h4>  
            </div>
            <div class="modal-body" style="width:600px; height:400px">     
                <section id="contact" style="">
                    <div class="container" style="width:100%;">
                        <div class="row">
                            <div class="about_our_company" style="margin-bottom: 20px;">
                                <h2 style="color:#ffff;" class="text-center">Write Your Message</h2>
                            </div>
                        </div> 
                        <div class="row">
                            <div class="col-md-6">
                                <form name="contactForm" id="contactForm">
                                    <div class="row">
                                        <div class="col-md-12">
                                            <div class="form-group required">
                                                <input ng-model="name" required type="text"  class="form-control" placeholder="Your Name *" id="name">
                                            </div>
                                            <div class="form-group">
                                                <input ng-model="email" type="email"  class="form-control" placeholder="Your Email *" id="email">
                                            </div>
                                            <div class="form-group">
                                                <input ng-model="phone" type="tel"  class="form-control" placeholder="Your Phone *" id="phone">
                                            </div>
                                            <div class="form-group">
                                                <textarea  ng-model="message" rows ="5" style = "resize:none;" required="enter"  class="form-control" placeholder="Your Message *" id="message"></textarea>
                                            </div>               
                                        </div>
                                        <div class="clearfix"></div>
                                        <div class="col-lg-12 text-center">
                                            <button type="button text-center"  class="btn btn-primary" ng-click="sendEmail();">Send Message</button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </section>         
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>

App.js

    var app = angular.module('dwgcloud', []).controller('mailController', ['$scope','$http',function($scope,$http){
        $scope.name=null;
        $scope.email=null;
        $scope.phone=null;
        $scope.message=null;

        $scope.sendEmail = function(){
            if(!$scope.name || !$scope.phone || !$scope.email || !$scope.message){
                alert("Values Cannot be Empty");
            }else{
                var name=$scope.name;
                var email=validateEmail($scope.email);
                var message=$scope.message;
                var phone=validateGsm($scope.phone);
                if(email){
                    if(phone.length===10){
                        $http({
                            method  : 'POST',
                            url  : 'services.php',
                            data:{
                                name:name,
                                email:email,
                                phone:phone,
                                message:message,
                                type:'contactMail'  
                            },
                            headers : {'Content-Type': 'application/x-www-form-urlencoded'} 
                        }).success(function(data) {
                            if (data.errors) {
                                console.log("An error occurred");
                            } else {
                                alert("Mail Sent");
                            }
                        });                     
                    }else{
                        alert("Please enter a valid phone number");
                    }
                }else{
                    alert("Please enter a valid e-mail address");
                }
            };  
        };

        $scope.validateEmail = function(email) {
            var regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/;
            return regex.test(email);
        }       

        $scope.validateGsm=function(phone){
            var gsm=$scope.phone.replace(/[^\d]/, "");
            return gsm;
        }
    }]);    

1 个答案:

答案 0 :(得分:4)

在$ scope对象中定义的validateEmail和validateGsm函数然后必须与&#34; $ scope一起使用。&#34;前缀也可以使用下面正确的代码。

var name=$scope.name;
var email=$scope.validateEmail($scope.email);
var message=$scope.message;
var phone=$scope.validateGsm($scope.phone);