在AngularJS自动完成期间自动完成输入

Question

我正在使用Google的AngularJS material design工具包。 以下是我使用的md-autocomplete指令：

<md-content class="md-padding">
    <form ng-submit="$event.preventDefault()">
        <p>Use <code>md-autocomplete</code> to search for matches from local or remote data sources.</p>
        <md-autocomplete
            ng-disabled="ctrl.isDisabled"
            md-no-cache="ctrl.noCache"
            md-selected-item="ctrl.selectedItem"
            md-search-text-change="ctrl.searchTextChange(ctrl.searchText)"
            md-search-text="ctrl.searchText"
            md-selected-item-change="ctrl.selectedItemChange(item)"
            md-items="item in ctrl.querySearch(ctrl.searchText)"
            md-item-text="item.display" 
            md-min-length="0" 
            placeholder="What is your favorite US state?">
            <md-item-template>
                <span md-highlight-text="ctrl.searchText" md-highlight-flags="^i">{{item.display}}</span>
            </md-item-template>
            <md-not-found>
                No states matching "{{ctrl.searchText}}" were found.
                <a ng-click="ctrl.newState(ctrl.searchText)">Create a new one!</a>
            </md-not-found>
        </md-autocomplete>
        <br>
        <md-checkbox ng-model="ctrl.simulateQuery">Simulate query for results?</md-checkbox>
        <md-checkbox ng-model="ctrl.noCache">Disable caching of queries?</md-checkbox>
        <md-checkbox ng-model="ctrl.isDisabled">Disable the input?</md-checkbox>

        <p>By default, <code>md-autocomplete</code> will cache results when performing a query.  After the initial call is performed, it will use the cached results to eliminate unnecessary server requests or lookup logic. This can be disabled above.</p>
    </form>
</md-content>

它看起来像这样：

但是，我希望它看起来like this，以填写文本的其余部分，即使我没有选择任何建议：

我该怎么做？如果可能的话，我想使用Angular材料设计构造。我是CSS领域的一个完整的新手。