angularjs - Kendo UI Angular JS とサービスによる AutoComplete

Question

私は Angular アプリを作成しており、Kendo UI コントロールのいくつかを使い始めています。AutoComplete コントロールの接続に問題があります。データベースから「オートコンプリート」値のリストを返すファクトリを使用したいと考えています。

オート コンプリート コントロールを iinclude し、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);
                    }
                }
            })
        }

私は、オートコンプリートに対して要求が満たされないことになります。

私の工場は果物の配列を返すだけです[私の果物工場コード：

     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;
                        });
                }

Answer 1

ここにあなたの解決策があります

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

plnker のために、私は $http を追加しませんでした (UPDATE - $http でhttp://plnkr.co/edit/unfgG5?p=previewがあります) UPDATE 2 - 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);
          });

      }
    }
  }