AngularJS UI选择验证

时间:2016-05-06 16:13:03

标签: angularjs ui-select

您好我正在开发一个AngularJS应用程序,其中包含一个字段,用于从远程源中选择多个电子邮件地址。我正在为该字段使用Angular UI Select。用户还可以输入不存在的有效电子邮件。问题是如何限制用户输入无效的电子邮件。

以下是示例代码段:

<ui-select multiple tagging tagging-label="('new' email)" ng-model="emails" theme="bootstrap" sortable="true" required>
<ui-select-choices repeat="email in emails track by emailId" refresh="refreshEmailAddresses($select.search)"
refresh-delay="0">
</ui-select-choices>
</ui-select>

3 个答案:

答案 0 :(得分:1)

       {

<ui-select multiple tagging ng-model="multipleName" ng-change="checkValidMail()" sortable="true" style="width: 263px;"  title="Enter Name"  on-select="afterSelection($item);" on-remove="afterRemoving($item); checkValidMail()">
   <ui-select-match placeholder="Enter Name...">{{$item | limitTo:25}}
   </ui-select-match>
   <ui-select-choices repeat="personName in multipleName |filter:$select.search">{{personName}} 
   </ui-select-choices>
</ui-select>
<span class="c-red" ng-if="errorMail"> You entered a wrong mail id..! </span>

}

在您的控制器中添加以下代码。

checkValidMail = function() {
     var exp = /^[_a-z0-9]+(\.[_a-z0-9]+)*@[a-z0-9-]*\.([a-z]{2,4})$/;
     for(var i of $scope.multipleName) {
         if(exp.test(i)) {
             $scope.errorMail = false;
         } else {
             $scope.errorMail = true;
             break;
         }
      }
 }

答案 1 :(得分:-1)

您可以使用正则表达式:

Alamofire.request(mutableURLRequest)

之后,将ngPattern添加到您的模块中并将其包含在您的指令中:

$scope.validEmail = /^(([^<>()\[\]\.,;:\s@\"]+(\.[^<>()\[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i;

答案 2 :(得分:-1)

你可以在输入上使用$ watch并在手表中使用正则表达式进行验证。也许这样的事情,希望它指出你正确的方向:

  $scope.$watch('multipleDemo.emails', function(n, o) {
    if (!n) {
      return;
    }
    //validation here drop into n
    if (n === expression) {
      $scope.emails.push(n);
    } else {
       var index = $scope.emails.indexOf(n);
       $scope.emails.slice(index,1);
    }
  });