如何顯示在劍道格列相關的外鍵數據

Question

我有劍道網格，由角控制器控制：

<div> 
    <kendo-grid options="mainGridOptions" k-data-source="gridData"> 
    </kendo-grid> 
</div> 

UPDATE 的數據加載，但網格ISN」 t呈現。 （我也有一個期限錯配和處理領域的地位。

"use strict"; 
angular.module("tenderApp") 
.controller("tenderCtrl", ["$scope", "adalAuthenticationService", "tenderSvc", "$q", function ($scope, adalService, tenderSvc, $q) { 
    $scope.mainGridOptions = null; 
    $scope.gridSource = null; 
    $scope.statusData = null; 

    function loadStatusData() { 
     return tenderSvc.getSector() 
      .then(function(sector) { 
       $scope.sectorData = sector.data.map(function (obj) { 
        return { 
         text: obj.bezeichnung, 
         value: obj.id 
        }; 
       }); 
       return $scope.sectorData; 
      }); 
    } 

    function loadGridSource(result) { 
     return tenderSvc.getItems() 
      .then(function (res) { 
       $scope.gridSource = res.data; 
       return res.data; 
      }); 
    } 

    loadStatusData() 
     .then(loadGridSource) 
     .then(function (res) { 
      //both properties are available at this point 
      console.log($scope.gridSource); 
      console.log($scope.sectorData); 
      $scope.gridData = new kendo.data.DataSource({ 
       transport: { 
        read: function (e) { 
         e.success($scope.gridSource); 
        }, 
        //... 
       }, 
       //... 
      }); 
      $scope.mainGridOptions = { 
       toolbar: ["excel"], 
       dataSource: $scope.gridData, 
       columns: [ 
        { field: "sektor", title: "Sektor", values: $scope.sectorData }, 
        { command: ["edit"], title: "Aktionen", width: "120px" } 
       ] 
      }; 

     }); 
}]); 

的問題是，在最後一次通話，這應該填充網格，不能正常工作。該console.log來電顯示，數據加載，但網格不顯示

Answer 1

不錯的一個，現在我學會了如何做你的鏈接，至於你的問題，我們不需要使用transport/read，而是我們可以單獨加載數據並設置它到這個網格dataSource請注意，請不要把k-data-source="gridData"放在你的網格html屬性中，因爲你已經有了網格選項

HTML：

<div><kendo-grid options="mainGridOptions" k-data-source="gridData"> 
    </kendo-grid></div> 

JS：

"use strict"; 
angular.module("tenderApp") 
.controller("tenderCtrl", ["$scope", "adalAuthenticationService", "tenderSvc", "$q", function ($scope, adalService, tenderSvc, $q) { 
    $scope.mainGridOptions = null; 
    $scope.gridSource = null; 
    $scope.statusData = null; 

    $scope.mainGridOptions = { 
     dataSource: new kendo.data.DataSource(), 
     toolbar: ["excel"], 
     columns: [ 
      { field: "sektor", title: "Sektor", values: $scope.sectorData }, 
      { command: ["edit"], title: "Aktionen", width: "120px" } 
     ] 
    }; 

    function loadStatusData() { 
     return tenderSvc.getSector() 
      .then(function(sector) { 
       $scope.sectorData = sector.data.map(function (obj) { 
        return { 
         text: obj.bezeichnung, 
         value: obj.id 
        }; 
       }); 
       return $scope.sectorData; 
      }); 
    } 

    function loadGridSource(result) { 
     return tenderSvc.getItems() 
      .then(function (res) { 
       $scope.gridSource = res.data; 
       return res.data; 
      }); 
    } 

    loadStatusData() 
     .then(loadGridSource) 
     .then(function (res) { 
      $scope.mainGridOptions.dataSource.data($scope.gridSource); 
     }); 
}]);