2016-04-28 2 views
2

検索中にテキストを自動補完するためにデータをバインドしようとしています。以下は私のコードです。私は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> 

関数querySearch(クエリ){

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

    return data; 
}); 

}

おかげ。

答えて

2

$scopeプロパティを使用すると、関数ではなく状態を保存できます。これを行うには、md-search-text-changeを使用して検索を開始する必要があります。 md-delayを使用して検索動作を調整することもできます。ディレクティブは詳細属性を参照してください。https://material.angularjs.org/latest/api/directive/mdAutocomplete

は、以下のようにコードを変更し

HTML:

<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> 

JSそれはwokringさ

$scope.querySearch = function (query) { 
    $http({ 
    url: '/api/GateMoveAPI/GetCustomerData', 
    method: 'GET', 
    params: { sSearchText: query } 
    }).success(function (data, status, headers, config) { 
    $scope.items = data; 
    }); 
} 
+0

.... Adityaありがとうございます。あなたは私の日を救った....! –

関連する問題