角度材质 - 打开md-autocomplete

时间:2017-10-16 16:22:14

标签: angular-material

如果我们的元素与其中一个选项匹配,如何直接打开md-autocomplete以查看选项。

模板:

<form class="example-form">
  <md-form-field class="example-full-width">
    <input mdInput placeholder="State" aria-label="State" [mdAutocomplete]="auto" [formControl]="stateCtrl">
    <md-autocomplete #auto="mdAutocomplete">
      <md-option *ngFor="let state of filteredStates | async" [value]="state.name">
        <img style="vertical-align:middle;" aria-hidden src="{{state.flag}}" height="25" />
        <span>{{ state.name }}</span> |
        <small>Population: {{state.population}}</small>
      </md-option>
    </md-autocomplete>
  </md-form-field>

  <br />

  <md-slide-toggle
    [checked]="stateCtrl.disabled"
    (change)="stateCtrl.disabled ? stateCtrl.enable() : stateCtrl.disable()">
    Disable Input?
  </md-slide-toggle>
</form>

1 个答案:

答案 0 :(得分:0)

使用md-min-length属性

md-min-length="0"

如果您有搜索功能,请确保返回所有数据。