如何在 ngxTypeahead 的输入框中显示突出显示的 typeahead 值？

Question

这是官方的 ngxTypeahead 插件

http://embed.plnkr.co/gV6kMSRlogjBKnh3JHU3/

在这里，当我们按下 keyUp 或 keyDown 时，我需要在类似于 firefox 搜索框 typeahead 的输入框中显示突出显示（蓝色）的 typeahead 选项的 innerHTML。 我该怎么做？

所以我在执行上述操作时遇到了这个问题

使用 jquery 我可以像这样获取我的目标元素

var target= $(this).siblings().find("li.active");

现在我变成这样了

这是我的 onKeyUp 函数

onKeyUp($event.key){
     if( $event.keyCode== '38'|| $event.keyCode == '40'){
     var target= $event.srcElement.nextElementSibling.children[4].children[0].innerText;
     }
}

所以如果我将调试器保留在 Onkey($event.key) 函数中

然后输入$event.srcElement.nextElementSibling.children

0:div.typeahead-backdrop

1:button.list-group-item

2:button.list-group-item

3:button.list-group-item

4:button.list-group-item.active

5:button.list-group-item

我就像上面一样。 所以我需要获取活动按钮innerText。在按钮内部它有一个跨度，我需要它的 innerHTML。 是否有任何特定的简单方法可以使用 angular2 访问上述目标？

Answer 1

编辑：

在输入#ngxTypeahead 上添加引用并在app.ts 代码中创建一个viewchild（从角度核心导入）

  @ViewChild("ngxTypeahead") ngxTypeahead: any;
   // then simply access the values using this.ngxTypeahead;

在选择功能中查看我的带有控制台日志的屏幕截图:) https://ibb.co/ehnfgS