Kendo UI 和 Angularjs：使网格内联可编辑

Question

我已经按照本指南在 angularjs 中集成了 kendo ui：Angular Kendo UI

现在我想让我的网格内联可编辑。在 angularjs 控制器中，我有：

gestionale.controller('mainController', function ($scope, $http) {

   $scope.products = new kendo.data.DataSource({
       transport: {
           read: {
               url: "api/Personale",
               dataType: "json"
           }
       },
   });
});

在 HTML 页面中：

<div kendo-grid k-data-source="products" k-selectable="'row'" k-sortable="true" k-toolbar ='["create"]'
     k-columns='[
{ "field": "Nome", "title": "Nome"},
{ "field": "Cognome", "title": "Cognome"},
{ "field": "Cellulare", "title": "Cellulare" },
{ command: ["edit", "destroy"], title: "", width: "172px" }
 ]' k-editable="inline" style="height: 365px">
</div>

使用此代码，网格已正确填充，我可以看到编辑和删除按钮，但是当我单击编辑按钮时，该行不会进入内联编辑模式（当我单击编辑按钮时刷新页面）。

如何获得内联编辑模式？ 谢谢

Answer 1

这就是你应该如何定义k-editable：

<div kendo-grid k-data-source="products" k-selectable="'row'" k-sortable="true" k-toolbar ='["create"]'
     k-columns='[
{ "field": "Nome", "title": "Nome"},
{ "field": "Cognome", "title": "Cognome"},
{ "field": "Cellulare", "title": "Cellulare" },
{ command: ["edit", "destroy"], title: "", width: "172px" }
 ]' k-editable='{"mode": "inline", "create": true, "update": false, "destroy": true}' style="height: 365px">
</div>