Angularjs網格列更改不影響在劍道UI

Question

我面臨一個問題與使用kendo網格與兩個按鈕。如果我點擊第一個按鈕它應該顯示三列，如果我點擊第二個按鈕，它應該只顯示兩列。但它似乎並沒有工作。我當前的例子是：

Reference Link

<div id="example" ng-app="KendoDemos"> 
    <div ng-controller="MyCtrl"> 
    <button ng-click="execute1($event)">Execute 1</button> 
    <button ng-click="execute2($event)">Execute 2</button> 
    <div kendo-grid="grid" k-options="gridOptions" k-rebind="selectedType"></div> 
    </div> 
</div> 

Answer 1

你有一個簡單的錯誤

在您使用dataModel1這兩種情況下，你必須使用「dataModel2 「爲gridOptions2

var gridOptions2 = { 
     dataSource: new kendo.data.DataSource({ 
      data: new kendo.data.ObservableArray(dataModel2), 
      columns: [ 
        { field: "Id", title:"ID", width: "56px" }, 
        { field: "company", title:"company", width: "110px" }, 
          { field: "os", title:"os", width: "110px" } 
        ] 
     }) 

這裏得到解決：

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

編輯：

現在我已瞭解的問題：

你有這樣的：

var gridOptions1 = { 
     dataSource: new kendo.data.DataSource({ 
      data: new kendo.data.ObservableArray(dataModel1), 
      columns: [ 
        { field: "Id", title:"ID", width: "56px" }, 
        { field: "company", title:"company", width: "110px" } 

        ] 
     }) 
    }; 

但 「列」 應該是數據源之外，像這樣：

var gridOptions1 = { 
     dataSource: new kendo.data.DataSource({ 
      data: new kendo.data.ObservableArray(dataModel1), 

     }), 
     columns: [ 
        { field: "Id", title:"ID", width: "56px" }, 
        { field: "company", title:"company", width: "110px" } 

        ] 
    }; 

這裏工作：

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