Javascript 剑道网格详细信息导致父网格刷新？

我搞不懂这是怎么回事。我正在尝试为网格创建一个自定义指令，并将使用元素属性自定义给定实例。在这样做的过程中，我创建了两个文件

网格控制器.js

app.controller('gridController', ['$scope', function ($scope ) {

    //Initilization code

    $scope.gridOptions = {
        //Setup options
    };

    $scope.detailOptions = function (e) {
        console.log('winning');
        return {
            dataSource: {
                transport: {
                    read: {
                        url: "/detail" + e.OrderNumber + ".json",
                        dataType: 'json'
                    }
                },
                error: function (e) {
                    console.log(e);
                },
                pageSize: true,
                serverPaging: false,
                serverFiltering: false,
                serverSorting: false,
            },
            columns: [
                    {
                        field: "ItemCode",
                        label: "lblItemCode",
                        title: ""
                    }, {
                        field: "ItemDesc",
                        label: "lblItemDesc",
                        title: ""
                    }, {
                        field: "QuantityOrdered",
                        label: "lblQuantityOrdered",
                        title: ""
                    }
            ],
            scrollable: false,
            sortable: true
        };
    }

}]);

app.directive('grid', function () {
    return {
        // Restrict E for element
        restrict: 'E',
        // Here we setup the template for the code we want to replace our directive
        template: "<div> \n\
                        <div kendo-grid='grid' \n\
                             k-options='gridOptions'\n\
                             k-data-source='dataSource'>\n\
                        </div> \n\
                        <script type='text/x-kendo-template'\n\
                                id='details'>\n\
                                <div kendo-grid >\n\
                                </div>\n\
                        </script>\n\
                   </div>",
        replace: true,
        scope: {
        },
        controller: "gridController",
        link: function (scope, element, attrs) {

            //Gather some attribute data and set it to the gridOptions object


            if(scope.$eval(attrs.detailsGrid))
            {
                scope.gridOptions.detailTemplate = kendo.template($("#details").html());
                scope.gridOptions.detailInit = scope.detailOptions;
            }

            //More customization code

            scope.dataSource = new kendo.data.DataSource({
                //Setup dataSource options for main grid
            });
        }
    };
});

网格指令.js

app.controller('gridController', ['$scope', function ($scope ) {

    //Initilization code

    $scope.gridOptions = {
        //Setup options
    };

    $scope.detailOptions = function (e) {
        console.log('winning');
        return {
            dataSource: {
                transport: {
                    read: {
                        url: "/detail" + e.OrderNumber + ".json",
                        dataType: 'json'
                    }
                },
                error: function (e) {
                    console.log(e);
                },
                pageSize: true,
                serverPaging: false,
                serverFiltering: false,
                serverSorting: false,
            },
            columns: [
                    {
                        field: "ItemCode",
                        label: "lblItemCode",
                        title: ""
                    }, {
                        field: "ItemDesc",
                        label: "lblItemDesc",
                        title: ""
                    }, {
                        field: "QuantityOrdered",
                        label: "lblQuantityOrdered",
                        title: ""
                    }
            ],
            scrollable: false,
            sortable: true
        };
    }

}]);

app.directive('grid', function () {
    return {
        // Restrict E for element
        restrict: 'E',
        // Here we setup the template for the code we want to replace our directive
        template: "<div> \n\
                        <div kendo-grid='grid' \n\
                             k-options='gridOptions'\n\
                             k-data-source='dataSource'>\n\
                        </div> \n\
                        <script type='text/x-kendo-template'\n\
                                id='details'>\n\
                                <div kendo-grid >\n\
                                </div>\n\
                        </script>\n\
                   </div>",
        replace: true,
        scope: {
        },
        controller: "gridController",
        link: function (scope, element, attrs) {

            //Gather some attribute data and set it to the gridOptions object


            if(scope.$eval(attrs.detailsGrid))
            {
                scope.gridOptions.detailTemplate = kendo.template($("#details").html());
                scope.gridOptions.detailInit = scope.detailOptions;
            }

            //More customization code

            scope.dataSource = new kendo.data.DataSource({
                //Setup dataSource options for main grid
            });
        }
    };
});

app.directive（'grid'，function（）{
返回{
//元素的限制E
限制：'E'，
//在这里，我们为要替换指令的代码设置模板
模板：“\n”\
\n\
\n\
\n\
\n\
\n\
\n\
",
替换：正确，
范围：{
},
控制器：“网格控制器”，
链接：函数（范围、元素、属性）{
//收集一些属性数据并将其设置为gridOptions对象
if（范围$eval（属性详情网格））
{
scope.gridOptions.detailTemplate=kendo.template（$（“#details”）.html（）；
scope.gridOptions.detailInit=scope.detailOptions；
}
//更多自定义代码
scope.dataSource=new kendo.data.dataSource({
//设置主网格的数据源选项
});
}
};
});

为了简洁起见，我排除了很多额外的代码

我的问题是，每当我试图打开一行的详细信息时，该行就会打开…关闭…网格就会刷新。看起来好像有什么东西正在崩溃，结果主网格正在刷新

---

以下是与注释部分相关的内容。

因此，在我发布问题的第二天，angular kendo发布了一份解决此问题的报告。在更新了库并修复了我的代码之后，细节网格就如预期的那样工作了