1、html 文件 添加详情内容模板 ``` <script type="text/x-kendo-template" id="template"> <div> <div class="modal-body" ng-cloak> <div class="form"> <form name="moCreateOrEditForm" role="form" class="form-horizontal" novalidate> <div class="form-body"> <div class="row"> <div class="col-md-12"> <div class="orders" kendo-grid ></div> </div> </div> </div> </form> </div> </div> <div> <button type="add" class="btn btn-sm btn-success" ng-click="vm.padd()"> <span>添加工序</span></button> <button type="delete" class="btn btn-sm btn-danger" > <span>批量删除工序</span></button> <button type="import" class="btn btn-sm btn-primary" > <span>导入派工信息</span></button> </div> </div> </script> ``` 2、js 文件 添加初始化 ``` vm.moGridOptions = vm.kendoGrid.init({ id: 'MoGrid', detailTemplate: kendo.template($("#template").html()), detailInit: vm.detailInit, }); ``` ``` vm.curdetailRowdata = null; vm.detailInit = function (e) { var detailRow = e.detailRow; vm.curdetailRowdata = e.data; console.log("初始化行相信"); //detailRow.find(".detailTabstrip").kendoTabStrip({ // animation: { // open: { effects: "fadeIn" } // } //}); detailRow.find(".orders").kendoGrid({ dataSource: { type: "odata", transport: { read: "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Orders" }, serverPaging: true, serverSorting: true, serverFiltering: true, pageSize: 7, filter: { field: "EmployeeID", operator: "eq", value: 1 } }, scrollable: false, sortable: false, pageable: false, columns: [ { field: "OrderID", title: "ID", width: "70px" }, { field: "ShipCountry", title: "Ship Country", width: "110px" }, { field: "ShipAddress", title: "Ship Address" }, { field: "ShipName", title: "Ship Name", width: "300px" } ] }); } ```