angular.js - 輸入信箱位址之後，如何使其自動在末尾加上分號？

Question

1: 我有這樣一個需求： 在郵箱輸入框裡面要輸入N個地址， 這N個郵箱之間必須要使用分號隔開才行2：能否通過angularJS 或其他方法驗證輸入的N個郵箱地址是分隔好的， 能夠正確發送郵件的？ 3：或者能夠判斷這這些...

滿天的星座 · Answer

你可以做一個類似tag-input的東西,在回車輸入的時候去驗證輸入內容是否符合郵件格式標準，驗證成功就add進去，驗證失敗就提示詳細消息,這樣能避免在用戶全部輸入完後再去驗證，能確保輸入的內容就是經過驗證後的

回車輸入

HTML

Directive

angular.module('BlurAdmin.pages.form')
      .directive('tagInput', tagInput);

  /** @ngInject */
  function tagInput() {
    return {
      restrict: 'A',
      link: function( $scope, elem, attr) {
        $(elem).tagsinput({
          tagClass:  'label label-' + attr.tagInput
        });
      }
    };
  }

阿神 · Answer

非常感謝 @crazy4x 的解答：
後來我自己找到一個新的方法：

目標：輸入框輸入多個郵箱地址的時候，檢驗N個郵箱地址是否正確並給出提示
方法：

HTML:

        
            email address
            

                 验证通过：{{custom_form.user_email.$valid}}

Js:(Angular)

   app.directive('multipleEmail', [function () {
        return {
            require: "ngModel",
            link: function (scope, element, attr, ngModel) {
                if (ngModel) {
                    var emailsRegexp =
                        /^([a-z0-9!#$%&'*+\/=?^_`{|}~.-]+@[a-z0-9-]+(\.[a-z0-9-]+)*[;；]?)+$/i;
                }
                var customValidator = function (value) {
                    var validity = ngModel.$isEmpty(value) || emailsRegexp.test(value);
                    ngModel.$setValidity("multipleEmail", validity);
                    return validity ? value : undefined;
                };
                ngModel.$formatters.push(customValidator);
                ngModel.$parsers.push(customValidator);
            }
        };
    }]);