Javascript AngularJS验证电话号码字段中的位数

我需要在两个字段中进行验证：

电话号码--（a）应该有10位数字

（b） 格式为：

XXX-XXX-XXXX

（c） 如果（a）和（b）不满足要求，应具有警报弹出窗口

电子邮件--应具有（a）无效电子邮件格式的验证和警报pop（在“@”之前/之后没有文本，“.”之后没有文本，“.”之前没有文本，但在“@”之后没有文本）

而且，只有在所有字段都有一些输入并满足所有验证后，才会在单击SUBMIT按钮时显示所有详细信息

现在，即使某个字段不满足验证要求，所有字段的详细信息都会显示在单击提交按钮上

我建议所有人都尝试代码，测试输出以准确了解我的问题所在：

(function() {

  // Module(No Global Namespace)
  var app = angular.module("githubViewer", []);

  var MainController = function($scope) {

    $scope.Search = function() {
      $scope.fname = $scope.firstname;
      $scope.lname = $scope.lastname;
      $scope.phno = $scope.phone;
      $scope.em = $scope.email;
    };



    phone = phone.replace(/[^0-9]/g, '');
    if (phone.length != 10) {
      alert("not 10 digits");
    } else {
      alert("yep, its 10 digits");
    }

    if ($scope.phone && $scope.firstname && $scope.lastname && $scope.email) {
      $scope.x = true;
    }


  };
  app.controller("MainController", MainController);

}());

HTML:

(function() {

  // Module(No Global Namespace)
  var app = angular.module("githubViewer", []);

  var MainController = function($scope) {

    $scope.Search = function() {
      $scope.fname = $scope.firstname;
      $scope.lname = $scope.lastname;
      $scope.phno = $scope.phone;
      $scope.em = $scope.email;
    };



    phone = phone.replace(/[^0-9]/g, '');
    if (phone.length != 10) {
      alert("not 10 digits");
    } else {
      alert("yep, its 10 digits");
    }

    if ($scope.phone && $scope.firstname && $scope.lastname && $scope.email) {
      $scope.x = true;
    }


  };
  app.controller("MainController", MainController);

}());