md-autocomplete возвращает TypeError: Невозможно прочитать свойство 'then' из неопределенного

Question

С использованием md-autocomplete компонент из angular material У меня проблема:

<md-autocomplete
            required
            md-search-text="searchTxt"
            md-selected-item-change="setModelValue(item.name)"
            ng-model="searchTxt"
            md-search-text-change = "searchItem(searchTxt)"
            md-items="item in pickerResult"
            md-item-text="item.name"
            md-min-length="0"
            md-delay="100"
            placeholder="Search...">
        <md-item-template>
            <span md-highlight-text="searchTxt" md-highlight-flags="^i">{{item.title}}</span>
        </md-item-template>
        <md-not-found>
           No results <span data-ng-if="form.detailModel.aspectName != null">per</span> {{form.detailModel.aspectName}}
        </md-not-found>
    </md-autocomplete>

это функция в моем контроллере

$scope.searchAspect = function(searchStr) {
        if(!searchStr) {
            var searchStrEncoded = "";
        } else {
            var searchStrEncoded = escape(searchStr);
        }
        var url = "/api/url&searchTxt=" + searchStrEncoded;
        $http({
            url: url,
            method: 'GET'
        }).success(function (data, status, headers, config) {
            $scope.pickerResult = data.data;
        });
    };

Если я что-то наберу, я получу данные. но при размытии ввода я получаю эту ошибку: TypeError: Cannot read property 'then' of undefined и я не могу вернуть свои данные. Я попытался изменить директиву md-items таким образом

md-items="item in searchItem(searchTxt)"

и я не получил ошибку, но автозаполнение не показывает результатов, даже если вызов http был успешным. Есть идеи?

РЕДАКТИРОВАТЬ с обещанием

$scope.searchAspect = function(searchStr) {
        if(!searchStr) {
            var searchStrEncoded = "";
        } else {
            var searchStrEncoded = escape(searchStr);
        }
        var deferred = $q.defer();
        var url = "/api/url&searchTxt=" + searchStrEncoded;
        $http({
            url: url,
            method: 'GET'
        }).success(function (data, status, headers, config) {
            deferred.resolve(data.data);
            $scope.pickerResult = data.data;
        }).error(deferred.reject);
        return deferred.promise;
    };

та же ошибка

Answer 1

Попробуй это

<md-autocomplete
        required
        md-search-text="searchTxt.val"
        md-items="item in searchAspect(searchTxt)"
        md-item-text="item.name"
        md-min-length="0"
        md-delay="100"
        placeholder="Search...">
    <md-item-template>
        <span md-highlight-text="searchTxt" md-highlight-flags="^i">{{item.title}}</span>
    </md-item-template>
    <md-not-found>
       No results <span data-ng-if="form.detailModel.aspectName != null">per</span> {{form.detailModel.aspectName}}
    </md-not-found>
</md-autocomplete>

$scope.searchAspect = function(searchStr) {
    if(!searchStr.val) {
        var searchStrEncoded = "";
    } else {
        var searchStrEncoded = escape(searchStr);
    }
    var url = "/api/url&searchTxt=" + searchStrEncoded;
    return $http({
        url: url,
        method: 'GET'
    }).then(function (data) {
        return data.data;
    });
};

насколько я понимаю, атрибуты md-items нуждались в обещании, а вы предоставляете массив.