Question

我有一个输入框，我正在尝试添加功能。我想编写一个类指令，以便轻松地为任何输入框添加功能。我希望当用户输入“@”时，会弹出一个显示选项的框，使用uib-typeahead。我无法找到一种显示方框而不会使原始文本框消失的方法，尽管理想情况下该框会弹出用户当前正在键入的位置

<div class="medium-2">
   <label>Age:</label> 
</div>
<div class="medium-10">
    <input type="text" class="form-control pop-up-variables" name="age" error-message="ageErrorMessage" required>
    </input>
</div>

我希望能够添加的块是：

<input class="variable-dropdown" type="text" uib-typeahead="number as number for number in numbers | filter:$viewValue" ng-model="selectedAttribute" placeholder="Choose variable"> 
</input>

我不想在指令中将其作为模板返回，因为我不想替换指令所在的块，但我不知道如何将它正确地添加到DOM中。

简单的JS看起来像：

  app.directive('popUpVariables', function() {

  return {
    restrict: 'C',
    controller: function($scope) {
        $scope.numbers = ['One', 'Two', 'Three', 'Four', 'Five'];
    },
    link: function (scope, element, attrs, ngModelCtrl) {
        element.on('keypress', function(event) {
            if (event.which === 64) {
                // This is where I want to show the second input
            }
        });
      }
   }
})

如何在指令中添加元素？

0 个答案: