3
我正在使用md-autocomplete，該md-items沒有正確更新從服務主機獲取的響應列表 - Ajax調用。md-items未正確更新md-autocomplete中的建議列表角度材料
HTML源代碼
<md-autocomplete flex required
md-input-name="autocompleteField"
md-no-cache="true"
md-input-minlength="3"
md-input-maxlength="18"
md-selected-item="SelectedItem"
md-search-text="searchText"
md-items="item in querySearch(searchText)"
md-item-text="item.DisplayName" Placeholder="Enter ID" style="height:38px !important;">
<md-item-template>
<span class="item-title">
<span md-highlight-text="searchText" md-highlight-flags="^i"> {{item.ID}} </span>
<span> - </span>
<span md-highlight-text="searchText" md-highlight-flags="^i"> {{item.Description}} </span>
</span>
</md-item-template>
</md-autocomplete>
AngularJS腳本
//bind the autocomplete list when text change
function querySearch(query) {
var results = [];
$scope.searchText = $scope.searchText.trim();
if (query.length >=3) {
results = LoadAutocomplete(query);
}
return results;
}
//load the list from the service call
function LoadCPTAutocomplete(id) {
TestCalculatorService.searchAutocomplete(id).then(function (result) {
if (result.data != null) {
$scope.iList = result.data;
} else {
$scope.iList = [];
}
});
return $scope.iList;
}
我越來越從服務主機自動完成列表。我正確地得到了響應，但它並未在UI中正確更新。
屏幕截圖1：
在這裏，我尋找，但它顯示了結果。我在Firebug中調試了這個問題，看到上面的屏幕截圖，請求被髮送了搜索詞，我得到了兩個匹配項作爲JSON對象的響應，如下所示：Screen Shot 2
在用戶界面，它顯示的結果82232，82247，82248，82270.但實際上服務回報是82247和82248.
如何更新項目源在UI的角度材質MD-自動完成？請幫助我。
支持性問題被張貼在以下鏈接Manually call $scope.$apply raise error on ajax call - Error: [$rootScope:inprog]
好..是啊，'searchAutocomplete'是異步的，所以你要返回存儲在'$ scope.iList 'searchAutocomplete'完成之前。 'querySearch'在第一次運行時返回未定義或空數組，然後在第二次運行時它顯示第一次運行的值，因爲它已經完成了，因此更新了'$ scope.iList'。我建議找到一種方法來做到這一點，而不是直接在視圖中使用queryResult，而是讓視圖看一個範圍var。 –
如''item in iList「'（儘管這本身並不能完全解決這個問題，但是當searchText改變時你仍然需要以某種方式調用queryResult） –
@KevinB我發佈了一個問題http：// stackoverflow。 com/questions/35646077/scope-apply-raise-error-on-ajax-call-error-rootcopeinprog - 在那裏，我使用了你說的方法，但我仍然面臨這個問題。所以，我GOOGLE了很多，並找到一個職位http://stackoverflow.com/questions/21127709/angular-controller-scope-not-updating-after-jquery-ajax-call因爲他們建議$ scope。$ apply，但是$ scope。$ apply會產生一個錯誤。如果我使用直接分配，那麼它會給出與本文相同的輸出。 –