md-autocomplete 返回 TypeError: Cannot read property 'then' of undefined

Question

使用来自angular material 的md-autocomplete 组件我遇到了问题：

<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 属性需要一个承诺，而您正在提供一个数组。