md-autocomplete $ http get不是绑定数据

时间:2016-04-28 17:46:07

标签: angularjs angular-material

我正在尝试在搜索时将数据绑定到自动完成文本框。以下是我的代码。我可以从api获取数据,但它不绑定到文本框。

  <md-autocomplete flex required flex-gt-sm="25"
                             md-input-name="autocompleteField"
                             md-input-minlength="2"
                             md-input-maxlength="18"
                             md-no-cache="noCache"
                             md-selected-item="selectedItem"
                             md-search-text="searchText"
                             md-items="item in querySearch(searchText)"
                             md-item-text="item.Customer_Nm"
                             md-floating-label="Customer">
                <md-item-template>
                    <span md-highlight-text="searchText">{{item.Customer_Nm}}</span>
                </md-item-template>

function querySearch(query){

    $http({
        url: '/api/GateMoveAPI/GetCustomerData',
        method: 'GET',
        params: { sSearchText: query }
    }).success(function (data, status, headers, config) {

    return data;
});

}

提前致谢。

1 个答案:

答案 0 :(得分:2)

使用{{movie.duration | secondsToHHMM | date:'HH:mm'}}属性来保存状态而不是函数。为此,您需要使用$scope触发搜索。您还可以使用md-search-text-change限制搜索行为。有关详细信息,请参阅指令属性:https://material.angularjs.org/latest/api/directive/mdAutocomplete

更改您的代码如下:

<强> HTML:

md-delay

<强> JS

<md-autocomplete flex required flex-gt-sm="25"
                         md-input-name="autocompleteField"
                         md-input-minlength="2"
                         md-input-maxlength="18"
                         md-no-cache="noCache"
                         md-selected-item="selectedItem"
                         md-search-text="searchText"
                         md-items="item in items"
                         md-search-text-change = "querySearch(searchText)"
                         md-item-text="item.Customer_Nm"
                         md-floating-label="Customer">
<md-item-template>
  <span md-highlight-text="searchText">{{item.Customer_Nm}}</span>
</md-item-template>