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

md-autocomplete返回TypeError：无法读取属性＆＃39;然后＆＃39;未定义的

1 个答案: