Question

当用户在textarea中键入“@”时，我想将一些值显示为建议。我使用了typeahead指令，但它显示了在textarea中输入的macthing值的建议。我只想在用户输入'@'时显示。请sugeest我。

Answer 1

我们必须为＆＃39; @@＆＃39;。

创建这样的预先输入

也许使用Bootstrap UI Typeahead。您只需创建自己的过滤器，并检查输入是否包含＆＃39; @＆＃39;。

如果你想自己完全创建它，那么你需要一个ngModel变量上的观察者。如果用户确实输入了stg，请检查@并显示/隐藏您的预先输入。

html必须使用范围编译$并在文本字段后注入。

var template = angular.element(
          '<ul class="dropdown-menu typeahead">' +
          '<li data-ng-repeat="match in arrMatches = (matches | filter:matchTypeAheadFilter)" ng-class="{\'active\':selectedMatch==match}" >' +
          '<a data-ng-bind="match" data-ng-click="injectMatch(match);"></a>' +
          '</li >' +
          '</ul>');

$compile(template.contents())(scope);
$(element).after(template);

现在这个模板是预先输入的容器。

每个li代表一个匹配项。

scope.$watch("ngModel", function (newValue,oldValue)
{
   if(newValue.indexOf('@') > -1)
    scope.openTypeAhead(newValue);
});

在openTypeAhead中您需要逻辑来显示容器，请应用点击+键事件。

scope.openTypeAhead = function(inputValue){            
          var firstTimeOpen = $(template).css("display") == "none";
          if(firstTimeOpen)
          {
            $(element).keydown(keyEvents);
            $(document).click(onClick);
          }

          $(template).show(); //show typeahead

          scope.matches = //load your matches
        }else{
          scope.hideTypeAhead();
        }
      };

我建议你的框架。因为这不是简单的。

如何在用户输入＆＃39; @＆＃39;时实现angularjs typeahead。只要

1 个答案: