Patrick Muñoz Vargas Patrick Muñoz Vargas - 2 months ago 55
HTML Question

md input container throwing error when I put input tags as child

Trying to use the following code from the Angular examples page:

<md-input-container>
<label>Vegetables</label>
<md-select ng-model="selectedVegetables"
md-on-close="clearSearchTerm()"
data-md-container-class="selectdemoSelectHeader"
multiple>
<md-select-header class="demo-select-header">
<input ng-model="searchTerm"
type="search"
placeholder="Search for a vegetable.."
class="demo-header-searchbox md-text">
</md-select-header>
<md-optgroup label="vegetables">
<md-option ng-value="vegetable" ng-repeat="vegetable in vegetables |
filter:searchTerm">{{vegetable}}</md-option>
</md-optgroup>
</md-select>
</md-input-container>


But this is the error I get:

Error: can only have one child input, textarea or select element!

The example can be found here (look for Select Header): https://material.angularjs.org/latest/demo/select

Answer

Well as i said on the comments the problem was the version of your Angular-material

Try to update it to the lastest version 1.0.9 or 1.1.0 and make a try.

<!-- Angular Material Library -->
<script src="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.js">
Comments