Angularjs 无法在角度引导模式窗口中获取对剑道网格的引用

我试图获得一个剑道格网的引用，该格网位于引导模式使用的模板中。当直接放置在app控制器的作用域中时，相同的网格可以工作，但会从modal实例控制器抛出未定义的错误

谁能告诉我我做错了什么

var app = angular.module('plunker', ['ui.bootstrap', 'kendo.directives']);

app.controller('MainCtrl', function($scope, $modal) {
  $scope.name = 'World';

  $scope.mySource = new kendo.data.DataSource({
          data: [
            {ColumnOne:'One', ColumnTwo:'Two'},
            {ColumnOne:'Three', ColumnTwo:'Four'},
            {ColumnOne:'Five', ColumnTwo:'Six'}
            ]
  });

  $scope.myGridChange = function(){
     var selectedRows = $scope.myGrid.select();
     console.log($scope.myGrid.dataItem(selectedRows[0]));
  };

   $scope.items = ['item1', 'item2', 'item3'];

   $scope.open = function () {

    $modal.open({
      templateUrl: 'myGridTemplate.html', //'myTemplate.html',
      controller: ModalInstanceCtrl,
      resolve: {
        items: function () {
          return $scope.items;
        }
      }
    });
   };
});


var ModalInstanceCtrl = function ($scope, $modalInstance, items) {

  $scope.items = items;
  $scope.selected = {
    item: $scope.items[0]
  };

  $scope.myTempSource = new kendo.data.DataSource({
          data: [
            {ColumnOne:'One', ColumnTwo:'Two'},
            {ColumnOne:'Three', ColumnTwo:'Four'},
            {ColumnOne:'Five', ColumnTwo:'Six'}
            ]
  });

   $scope.myTempGridChange = function(){
     var selectedRows = $scope.myTempGrid.select();
     console.log($scope.myTempGrid.dataItem(selectedRows[0]));
  };

  $scope.ok = function () {
    $modalInstance.close($scope.selected.item);
  };

  $scope.cancel = function () {
    $modalInstance.dismiss('cancel');
  };
};

我无法在处调用未定义的方法“select”

var selectedRows = $scope.myTempGrid.select();

这是我的plnkr的链接

---

在您的模式之外，控制器和网格共享相同的范围。但是，当它们位于模态范围内时，网格的范围嵌套在控制器范围内。不完全确定这是为什么，但这里是为什么它是一个问题

当您有嵌套作用域时，子作用域将典型地从父作用域继承。使用原型继承，当您直接在子作用域上设置某些内容时，它不会覆盖父作用域。因此，当Kendo设置$scope.myTempGrid时，它只在子作用域上设置，而当您尝试从控制器访问它时，它不在那里

这可能会让人非常困惑，但幸运的是，如果您总是避免将内容直接绑定到范围，您就不应该遇到这种问题。例如，如果将网格放在父范围中的某个容器对象中，则不会遇到此问题

例如：

控制器：

...
$scope.container = {};
...

HTML

。。。
...

---

更好的解决方案是始终使用“controller as”语法：

谢谢，我将尝试使用controller as语法。

...
<div kendo-grid="container.myTempGrid">
...