ui-grid中可扩展模板的ng-click事件

时间:2018-03-27 12:57:02

标签: angularjs ui-grid

ui-grid(可扩展的ui网格)中的可扩展模板的

ng-click事件无效。但我不知道如何绑定可扩展模板事件。 如果我不使用子网格,只使用带有此按钮的扩展模板,我该如何访问数据

var app = angular.module('app', ['ngTouch', 'ui.grid', 'ui.grid.expandable', 'ui.grid.selection', 'ui.grid.pinning']);

app.controller('MainCtrl', ['$scope', '$http', '$log', '$timeout', function ($scope, $http, $log, $timeout) {

         $scope.showdiv = function(){
      $scope.templateURL = 'inline-edit.html';
 };
  $scope.gridOptions = {
    expandableRowTemplate: 'expandableRowTemplate.html',
    expandableRowHeight: 150,
    expandableRowScope: { 
      clickMeSub: function(){
        alert('hi');
      }
    },
    //subGridVariable will be available in subGrid scope

      onRegisterApi: function (gridApi) {
                    gridApi.expandable.on.rowExpandedStateChanged($scope, function (row) {
                        if (row.isExpanded) {
                            var data=[ your data
                            ];
                            row.entity.appScopeProvider= $scope.subScope;
                                                    row.entity.subData=[data[$scope.gridOptions.data.indexOf(row.entity)]];


                                    //row.entity.subData = data1;

                        }
                    });
                }
  }




  $scope.gridOptions.columnDefs = [
    { name: 'id' },
    { name: 'name'},
    { name: 'age'},
    { name: 'address.city'}
  ];

1 个答案:

答案 0 :(得分:0)

以下是您正在努力实现的plunker

你的consumeablerowtemplate.html应该只是一个div使用像html中那样的subgridoptions:

<div ui-grid="row.entity.subGridOptions" style="height:140px;"></div>

和js:

data[i].subGridOptions = {
      columnDefs: [ {name:"Id", field:"id"},{name:"Name", field:"name"} ],
      data: data[i].friends
    }