动态绑定剑道网格数据源绑定到指令

Posted

技术标签:

【中文标题】动态绑定剑道网格数据源绑定到指令【英文标题】:Dynamic bind kendo grid dataSource binded to directive 【发布时间】:2017-09-26 07:20:01 【问题描述】:

我在控制器中创建 dataSourec

$scope.dataSource = new kendo.data.DataSource(
                  transport: 
                      read: function (e) 
                          e.success(response.data.value);
                      
                  ,
                  serverFiltering: true,
                  serverSorting: true,
                  pageSize: 20,
                  schema: 
                      model: 
                          fields: 
                              languageId:  type: 'number', editable: true, nullable: false ,
                              dateStart:  type: 'date', ediitable: true ,
                              dateEnd:  type: 'date', ediitable: true ,
                              count:  type: 'number', editable: true, nullable: false 
                          
                      
                  
              );

然后我将它绑定到我的组件

    <div data-ng-if="!displayList">
    <analytics-grid data-data-source="dataSource"></analytics-grid>
</div

我将它添加到我的网格选项中

 ctrl.gridOptions = 
                    dataSource: ctrl.dataSource,
                    sortable: true,
                    pageable: true,
                    columns: [
                        field: "languageId",
                        title: "language",
                        width: "120px",
                        filterable: false,
                        values: _languagesLookupDS.data().toJSON()
                    , 
                        field: "count",
                        title: "count"
                    , 
                        field: "dateStart",
                        title: "dateStart"
                    , 
                        field: "dateEnd",
                        title: "dateEnd"
                    ],
                    editable: 
                        mode: 'popup',
                        confirmation: true
                    ,
                    messages:  commands:  create: ""  
                ;

然后在组件视图中绑定剑道网格

<kendo-grid data-k-options="$ctrl.gridOptions" data-k-ng-delay="$ctrl.gridOptions" data-k-rebind="$ctrl.dataSource"></kendo-grid>

当有人切换按钮时,我会显示组件视图(上面代码中的 data-ng-if="!displayList")。我必须将按钮切换到 displayList = true,然后再切换到 displayList = false,以更新网格数据,为什么当我的控制器中的 dataSource 更改时它不会动态更新,并且按钮设置为显示 kendoGrid?

【问题讨论】:

【参考方案1】:

我已经通过将 ctrl.gridOptions 声明为函数解决了这个问题

 ctrl.gridOptions = function () 
                return 
                    dataSource: ctrl.dataSource,
                    sortable: true,
                    columns: [
                        field: "languageId",
                        title: "language",
                        width: "120px",
                        filterable: false,
                        values: _languagesLookupDS.data().toJSON()
                    , 
                        field: "count",
                        title: "count"
                    , 
                        field: "dateStart",
                        title: "dateStart"
                    , 
                        field: "dateEnd",
                        title: "dateEnd"
                    ]
                ;
            

然后将其绑定到视图

<kendo-grid data-k-scope-field="$ctrl.analyticsGrid" data-k-options="$ctrl.gridOptions()" data-k-rebind="$ctrl.dataSource"></kendo-grid>

我的工作伙伴告诉我发生了问题,因为视图正在寻找选项对象并且不知道在数据源更改时如何解决它。现在它只是调用方法并使用新数据源获取选项。

【讨论】:

以上是关于动态绑定剑道网格数据源绑定到指令的主要内容,如果未能解决你的问题,请参考以下文章

剑道网格中绑定海量数据的逻辑是啥

如何使用动态 WHERE 子句将网格视图绑定到数据源?

剑道网格刷新(数据绑定两次)

将剑道网格与数据源绑定不显示数据

在 MVC 中重新绑定剑道网格

从另一个视图重新绑定剑道网格到以前的搜索条件的正确方法是啥(后退按钮不起作用)