Question

我有要求我可以为电子邮件设置预定义的后缀，因此用户只需输入电子邮件的第一部分...所以我要说我的电子邮件ID是：abc@gmail.com

因此输入将具有gmail.com的后缀，用户应该只输入“abc”。所以我想要实现的是：显示值应为abc，但对于ngModel值应为“abc@gmail.com”。

我怎样才能使用指令实现这个？

我已准备好基本指令：plunker

但不确定如何使用，链接或编译函数来实现上述结果

Answer 1

尝试此指令：

app.directive("csRadioFieldFormat", function() {
  return {
    require: 'ngModel',

    restrict: 'A',
    link: function(scope, element, attrs, ctr) {
      ctr.$parsers.unshift(function(value) {

        var isValid = value !== "";

        ctr.$setValidity("required", isValid);
        if (!isValid){
          return undefined;
        }

        if (value.indexOf(attrs.suffix) < 0) {
          value = value + attrs.suffix;
        }

        return value;
      });

      ctr.$formatters.unshift(function(value) {
        value = value || "";
        return value.replace(attrs.suffix, "");
      });
    }
  }
});

将其应用到您的电子邮件字段：

<input type="email" name="myfield" ng-required="options.required" ng-model="ngModel" cs-radio-field-format suffix="{{options.suffix}}"/>

DEMO

angularjs电子邮件指令，具有不同的显示和模型值

1 个答案: