Kendo UI Angular JS 和 AutoComplete 服务

我正在制作一个 Angular 应用程序，并开始使用一些 Kendo UI 控件。我在连接自动完成控件时遇到一些问题。我想使用一个工厂来从我的数据库返回“自动完成”值的列表。

我已经包含了自动完成控件，并且我正在尝试使用 k-options 属性：

<input kendo-auto-complete ng-model="myFruit" k-options="FruitAutoComplete"  />

在我的控制器中，以下硬编码的水果列表有效：

 $scope.FruitAutoComplete = {
            dataTextField: 'Name',
            dataSource:[
                { id: 1, Name: "Apples" },
                { id: 2, Name: "Oranges" }
            ]
}

当我将其移至使用我的工厂时，我看到它调用并从工厂返回数据，但它从未绑定到屏幕。

 $scope.FruitAutoComplete = {
            dataTextField: 'Name',
            dataSource: new kendo.data.DataSource({
                transport: {
                    read: function () {
                        return    FruitFactory.getYummyFruit($scope.myFruit);
                    }
                }
            })
        }

I end up with the request never being fulfilled to the auto complete.

我的工厂刚刚退回一系列水果[ 我的水果工厂代码：

     getYummyFruit: function (val) {
                    return $http.get('api/getFruitList/' + val)
                        .then(function (res) {                          
                            var fruits= [];
                            angular.forEach(res.data, function (item) {
                                fruits.push(item);
                            });
                            return fruits;
                        });
                }

这是您的解决方案

http://plnkr.co/edit/iOq2ikabdSgiTM3sqLxu?p=preview http://plnkr.co/edit/iOq2ikabdSgiTM3sqLxu?p=preview

为了 plnker 的缘故，我没有添加 $http （更新 - 这里是http://plnkr.co/edit/unfgG5?p=preview http://plnkr.co/edit/unfgG5?p=preview与 $http） 更新2 -http://plnkr.co/edit/01Udw0sEWADY5Qz3BnPp?p=preview http://plnkr.co/edit/01Udw0sEWADY5Qz3BnPp?p=preview按照@SpencerReport 修复了问题

控制器

$scope.FruitAutoCompleteFromFactory = {
            dataTextField: 'Name',
            dataSource: new kendo.data.DataSource({
                transport: {
                    read: function (options) {
                        return  FruitFactory.getYummyFruit(options)

                    }
                }
            })
        }

工厂 -

factory('FruitFactory', ['$http',
  function($http) {
    return {
      getYummyFruit: function(options) {
        return $http.get('myFruits.json').success(
          function(results) {
            options.success(results);
          });

      }
    }
  }