Javascript 在AngularJS输入中@符号后完成电子邮件域

我正在尝试创建一个函数，该函数将自动检测用户是否键入了“@”符号，并将使用corporate domain自动完成该字段。页面上可能有多个字段，这就是为什么我不想硬编码他们的模型（例如

$scope.user.email

）。
这是我到目前为止得到的：

<input ng-model="user.email" ng-keyup="autocompleteEmail($event);">

自动完成工作正常，但当我尝试提交带有此新值的表单时，问题就出现了-它没有考虑我自动添加的mycompany.com域。正在发送的请求具有

user.email=test@

---

如何使用AngularJS实现此自动完成功能？

您可以将

用户

变量作为参数传递到方法中，以便可重用：

 <input ng-model="user.email" ng-keyup="autocompleteEmail($event, user);">

---

试试这个

为了使它尽可能通用，你可以采用一种指导性的方法。看到这个了吗

myApp.directive（'CompleteMailDomain'，function（）{ 返回{ 范围：{ 域：“@”， 电子邮件：'=' }, 限制：'E'， 模板：“”， 链接：函数（$scope、elem、attr）{ $scope.autoCompleteEmail=函数（$event）{ log（$scope.email）； if（$event.keyCode==48 | |$event.keyCode==50）和&$event.srceelement.value.slice（-1）===“@”）{ $scope.email+=$scope.domain； } } } }; }); 在那里，我创建了一个名为“完整电子邮件域”的指令。它接收域和电子邮件，并在用户输入“@”后自动更新模型。这应该是完全可重用的，并且应该限定将值更改为新指令的实际处理范围

---

也许一个改进是将域存储在用户对象上，并将用户传递给指令。然后，您可以以非常类似的方式访问“域”和“电子邮件”属性。

这将如何解决问题？你能详细解释一下这个概念吗？只要把我说的话交换一下。。。让我知道它是否有效如果您通过jquery设置输入值，angular无法知道，因此更改不会传播。您需要使用angular结构来更改模型，以便angular可以跟踪itI不能使用

$scope

变量，因为可能有多个输入需要此自动完成，并且该函数应该是通用的，以便为每个输入工作。另外，我已经更新了这个问题，让其他人记住这个信息。谢谢。然后用您的预期行为更新问题。您可以跟踪要在对象或数组中自动完成的字段的所有模型，然后从控制器端更新适当的模型。由于双向绑定，也应该更新视图。

 <input ng-model="user.email" ng-keyup="autocompleteEmail($event, user);">

  $scope.autocompleteEmail = function($event, user) {
       if (($event.keyCode === 48 || $event.keyCode === 50) &&        $event.srcElement.value.slice(-1) === "@") {
  // @ symbol is typed - completing email
  user.email  += "mycompany.com";
}

myApp.directive('completeEmailDomain', function(){  
 return {
    scope: {
       domain: '@',
       email: '='
    },
     restrict: 'E',
     template: '<input ng-model="email" ng-keyup="autoCompleteEmail($event);" />',
     link: function($scope, elem, attr) {
          $scope.autoCompleteEmail = function($event){
            console.log($scope.email);
            if (($event.keyCode === 48 || $event.keyCode === 50) && $event.srcElement.value.slice(-1) === "@") {
              $scope.email += $scope.domain;
            }
          }
     } 
 }; 
});