如何将验证属性添加到md-autocomplete angular material指令

tre*_*eat 8 angularjs angularjs-directive angular-material

我正在使用版本0.7.1的角度材料.我正在使用此处所述的自动完成功能: 自动完成演示

但是,它似乎不支持验证逻辑,即使它生成textarea: Autocomplete指令文档

我想我可以在querySearch函数中添加逻辑来将ng-valid切换为ng-invalid.它是否正确?如果是这种情况,那么我需要一个关于md-autocomplete的句柄,但这很难,因为name属性被删除了.

Hen*_*Neo 10

快速更新,获得Angular Material网站上的解决方案(最新版本1.0.0-),https: //material.angularjs.org/latest/demo/autocomplete .

您会发现现在支持'required'和'ng-messages'.

<div ng-controller="DemoCtrl as ctrl" layout="column" ng-cloak>
<md-content class="md-padding">
<form ng-submit="$event.preventDefault()" name="searchForm">
  <p>The following example demonstrates floating labels being used as a normal form element.</p>
  <div layout-gt-sm="row">
    <md-input-container flex>
      <label>Name</label>
      <input type="text"/>
    </md-input-container>
    <md-autocomplete flex required
        md-input-name="autocompleteField"
        md-input-minlength="2"
        md-input-maxlength="18"
        md-no-cache="ctrl.noCache"
        md-selected-item="ctrl.selectedItem"
        md-search-text="ctrl.searchText"
        md-items="item in ctrl.querySearch(ctrl.searchText)"
        md-item-text="item.display"
        md-floating-label="Favorite state">
      <md-item-template>
        <span md-highlight-text="ctrl.searchText">{{item.display}}</span>
      </md-item-template>
      <div ng-messages="searchForm.autocompleteField.$error" ng-if="searchForm.autocompleteField.$touched">
        <div ng-message="required">You <b>must</b> have a favorite state.</div>
        <div ng-message="minlength">Your entry is not long enough.</div>
        <div ng-message="maxlength">Your entry is too long.</div>
      </div>
    </md-autocomplete>
  </div>
</form>
Run Code Online (Sandbox Code Playgroud)

  • 如果我们删除`md-floating-label`属性,验证不起作用.谁知道为什么? (4认同)