Question

Angular Material库中有一个<md-select>控件。它只允许从列表中选择选项。但是，如果我想允许用户在此字段中编写自己的值，该怎么办？所以我想要可编辑的md-select，允许从列表中选择值或编写自己的值。有可能吗？

Answer 1

请改用<md-autocomplete>。请参阅demo。

Answer 2

在https://github.com/angular/material/issues/7970找到，所以积分转到icenold

<style>
    .combocontainer{
        width:200px;
        display:inline;
    }
    .comboinput {
        position:relative;
        top:-3px;
        left:-2.75em;
    }
    .comboinput div._md-text{
        display:none !important;
    }
    .comboinput md-select-value:not([disabled]):focus ._md-select-value{
        border-bottom:none;
    }
    .comboinput md-select-value{
        min-width: 0.0em;
        border-bottom:none !important;
    }
</style>

<div class="combocontainer">
    <md-input-container>
        <label>combobox1</label>
        <input type="text" ng-model="chosen"/>
    </md-input-container>
    <md-input-container class="comboinput">
        <md-select ng-model="chosen" md-container-class="combomenu">
            <md-option ng-value="'item 1'">item 1</md-option>
            <md-option ng-value="'item 2'">item 2</md-option>
            <md-option ng-value="'item 3'">item 3</md-option>
        </md-select>
    </md-input-container>
</div>
<div class="combocontainer">
    <md-input-container>
        <label>combobox2</label>
        <input type="text" ng-model="chosen2" />
    </md-input-container>
    <md-input-container class="comboinput">
        <md-select ng-model="chosen2" md-container-class="combomenu">
            <md-option ng-value="'item 1'">item 1</md-option>
            <md-option ng-value="'item 2'">item 2</md-option>
            <md-option ng-value="'item 3'">item 3</md-option>
        </md-select>
    </md-input-container>
</div>

如何为用户的自定义值实现可编辑的md-select？

2 个答案: