有没有办法检测是否显示了 md-autocomplete material2+angular2 上的选择面板？

Question

我正在尝试检测面板是否正在显示，但是从文档中，我似乎无法弄清楚使用什么可以正确地告诉我哪个属性会触发正确的事件.

谁能帮忙，谢谢

Answer 1

md-autocomplete 有一个属性叫做 showPanel。您可以使用自动完成的 # 引用 return showPanel 的值。

这是一个示例，对于输入字段中的每个 keyup 事件，我检查 showPanel 的值并将其推送到数组以验证它是否有效。

html:

<md-input-container>
  <input mdInput placeholder="State" 
         [mdAutocomplete]="auto" 
         [formControl]="stateCtrl"
         (keyup)="checkPanel(auto.showPanel)">
</md-input-container>

<md-autocomplete #auto="mdAutocomplete">
  <md-option *ngFor="let state of filteredStates | async" [value]="state">
    {{ state }}
  </md-option>
</md-autocomplete>

<p></p>

<div style="margin-top: 300px">
  <span>Is panel open at keyup:</span>
  <div *ngFor="let x of flags; let i = index">
    keyup {{i+1}}: {{x}}
  </div>
</div>

ts:

checkPanel(val){
  this.flags.push(val);
}

Plunker demo

有没有办法检测是否显示了 md-autocomplete material2+angular2 上的选择面板？

Is there a way to detect if the selection panel on a md-autocomplete material2+angular2 is being shown?

angular-material2

angular