ng-标签-输入自动竞争无效

Question

我想使用具有自动完成功能的ng-tags-input，但是我得到了一个错误：

e.then不是一个函数

这是我的HTML

<tags-input ng-model="selectedBodyParts" class="ui-tags-input" add-on-paste="true">
      <auto-complete source="loadBodyParts($query)" min-length="0" load-on-focus="true">

      </auto-complete>
</tags-input>

和AngularJS代码：

    $scope.loadBodyParts = function ($query){
        var bodypartList = angular.copy($scope.bodyParts);
        return bodypartList.filter(function(bodypart) {
            return bodypart.bodyPartName.toLowerCase().indexOf($query.toLowerCase()) !== -1;
        });
};

任何帮助都将不胜感激！

Answer 1

与ng-tag-input一起使用的加载源的函数应该返回一个Promise对象，承诺有一个带有签名.then(fn, fn)的函数，该函数可能是它查找的函数，但没有找到，因此您的.

e.then is not a function错误

如果您将转到演示部分，在“使用自动完成的简单标记输入”下，您将看到以下代码

$scope.loadTags = function(query) {
    return $http.get('tags.json');
};

在角度上，$http.get返回一个承诺。如果我必须更改您的代码，我可能会使用$q对您的数据进行promisify，并返回包含您过滤过的数据的承诺。

$scope.loadBodyParts = function ($query){
    var bodypartList = angular.copy($scope.bodyParts);
    var promisifyMe = bodypartList.filter(function(bodypart) {
        return bodypart.bodyPartName.toLowerCase().indexOf($query.toLowerCase()) !== -1;
    });
    return $q.when(promisifyMe);
};

$q文档