ngx-bootstrap typehead自动关注Internet Explorer 11

时间:2019-04-20 11:24:10

标签: internet-explorer angular-reactive-forms ngx-bootstrap typehead

我正在使用带有角度6反应形式控件的ngx-bootstrap字头。它可以在除Internet Explorer 11之外的所有浏览器上正常工作。每当没有选择字体建议列表的选项时,我都会再次在字体控件上设置的焦点之外单击。您可以在

看到相同的问题

https://valor-software.com/ngx-bootstrap/#/typeahead#reactive-forms

在这里,我已经确定了反应式的相同问题。

如果有人对此有任何选择,请告诉我。

谢谢, 阿莫尔·拉汉斯(Amol Rajhans)。

1 个答案:

答案 0 :(得分:0)

我在IE中遇到了相同的行为,并创建了一个快速的解决方法。

import { Directive, Input } from '@angular/core';
import { TypeaheadDirective } from 'ngx-bootstrap';
const isIE = navigator.userAgent.indexOf('MSIE')!==-1 || navigator.appVersion.indexOf('Trident/') > -1;


@Directive({selector: '[typeaheadIeFix]', exportAs: 'bs-typeahead'})
export class TypeaheadIeFixDirective extends TypeaheadDirective {
  private ie_init:boolean = false;
  @Input('typeaheadIeFix') typeahead: any;
  /**
   * when ngModel or formControl is init'ed, it seems to update input value triggering an 'input' event in IE.
   * that 'input' event then causes typeahead directive to focus on the bound input and even open its suggestion list if possible. 
   */
  onInput (e) {
    if (isIE && !this.ie_init) {
      this.ie_init = true;
      return;
    }
    super.onInput(e);
  }
}