angularjs - md-autocomplete 中的 ng-message 以错误的样式显示并与输入字段重叠

Question

我有一个 md-autocomplete，里面有 ng-messages：

<md-autocomplete flex required="required"
     md-input-name="player"
     md-input-minlength="0"
     md-autoselect="true"
     md-select-on-match="true"
     md-selected-item="item.player"
     md-item-text="player.name"
     md-search-text="playerSearchText"
     md-items="player in filterPlayerItems(playerSearchText)"
     md-no-cache="true"
     md-floating-label="Select Player">

     <md-item-template>
          <span>{{player.name}}</span>
     </md-item-template>
     <div ng-messages="form.player.$error" class="md-block">
         <div ng-message="required">This is required.</div>
     </div>
</md-autocomplete>

md-autocomplete 在表单内，一切正常，除了错误消息与输入字段和标签重叠：

在检查 DOM 时，我发现里面<md-autocomple-wrap>有<md-input-container>一个flex类：

如果我删除该类，则消息将转到正确的位置：

我可以看到md-autocomplete有关 angular-material 演示的示例运行良好，我正在按照他们的示例进行操作。我在这里想念什么？