md-autocomplete与bootstrap的class =“modal-content”无法正常工作

Question

我的主要模态组件是： -

<div class="modal-content">
    <div class="modal-header"> </div>
    <div class="modal-body">
        <display-states-component rolesdata="$ctrl.modaldata.displayStatesRoles"></display-states-component>
    </div>
</div>

DisplayStatesComponent是（Angular 1.5 Component architecture）

<form ng-submit="$event.preventDefault()">
    <md-autocomplete md-no-cache="true" md-selected-item="$ctrl.displayPerRoles[$index].roleName" md-search-text="$ctrl.searchText" md-items="item in $ctrl.querySearch($ctrl.searchText)" md-item-text="item.value" md-min-length="0" placeholder="Select Role?">
        <md-item-template>
            <span md-highlight-text="$ctrl.searchText" md-highlight-flags="^i">{{item.value}}</span>{{item.value}}
        </md-item-template>
        <md-not-found>
            No role matching "{{$ctrl.searchText}}" were found.
            <a ng-click="$ctrl.manageStates('ADD')">Create a new one!</a>
        </md-not-found>
    </md-autocomplete>
</form>

我的相应显示状态控制器是： -

 $ctrl.states = loadAll();

 $ctrl.querySearch = function(query) {
     var results = query ? $ctrl.states.filter(createFilterFor(query)) : $ctrl.states,
         deferred;
     console.log("With my Testings in else--->", results);
     return results;
 }

 /**
  * Build `states` list of key/value pairs
  */
 function loadAll() {
     var allStates = 'Alabama, Alaska, Arizona, Arkansas, California, Colorado, Connecticut, Delaware,\
              Florida, Georgia, Hawaii, Idaho, Illinois, Indiana, Iowa, Kansas, Kentucky, Louisiana,\
              Maine, Maryland, Massachusetts, Michigan, Minnesota, Mississippi, Missouri, Montana,\
              Nebraska, Nevada, New Hampshire, New Jersey, New Mexico, New York, North Carolina,\
              North Dakota, Ohio, Oklahoma, Oregon, Pennsylvania, Rhode Island, South Carolina,\
              South Dakota, Tennessee, Texas, Utah, Vermont, Virginia, Washington, West Virginia,\
              Wisconsin, Wyoming';

     return allStates.split(/, +/g).map(function(state) {
         return {
             value: state.toLowerCase(),
             display: state
         };
     });
 }

我的过滤功能

function createFilterFor(query) {
    var lowercaseQuery = angular.lowercase(query);

    return function filterFn(state) {
        return (state.value.indexOf(lowercaseQuery) === 0);
    }
};

我正在使用此代码搜索状态，因为用户在自动填充框中键入州名称。我在控制台上得到了结果但是没有显示项目文本（我认为隐藏在bootsrap的模态之后）。

提前致谢。