将 onclick/ng-click 事件附加到网格数据绑定事件中的元素

Posted 2023-05-07

【中文标题】将 onclick/ng-click 事件附加到网格数据绑定事件中的元素

【英文标题】：attach onclick/ng-click event to element in grid databound event

【发布时间】：2017-12-25 14:04:02

【问题描述】：

我有一个 TypeCtrl ES6 类角度控制器，它使用剑道数据网格指令并具有网格配置选项模板，在网格模板中，我需要从 TypeCtrl 类调用一个方法。我需要将 onclick 或 ng-click 事件附加到模板行内的 span。然而，需要在点击时触发的功能属于 TypeCtrl 类。如何在剑道网格的数据绑定事件中获取 TypeCtrl 的上下文。我看到这里的“this”指向剑道网格，

这是我所拥有的，请告诉我如何在数据绑定事件中访问控制器方法

//Grid options defined in Class TypeCTrl along with openSub method

    class TypeCtrl
        constructor() 
        $onInit() 
            this.gridOptions = 
            name: 'test',
            dataBound: function(e) 
                //Find the span and on click , attach the typectrl controller's opensub method
                let grid = this
                let item = grid.tbody.find('#testClick');
                let value = item.innerhtml;
                item.on('click', this.openSub(value);

            
            columns: [
                    field: 'subscriptionName',
                    hidden: true,
                    groupHeaderTemplate: function(dataItem) 
                        let temp;
                        let sname = dataItem.value;
                        if (sname) 
                            temp = '<span id="testClick">' + sname + '</span>';
                        
                        return temp;
                    .bind(this)
                , 
                    field: 'name',//Todo: show icons
                    title: 'name'
                , 
                    field: 'version',
                    title: 'version'
                ]
            
        

            openSub(name) 
                alert('thisis a box');
            
        

        TypeCtrl.$inject = ['$scope'];

    angular.module('core').controller('TypeCtrl', TypeCtrl);

    export default TypeCtrl;

我看到当我点击 span 标签时，它的上下文丢失了，并且没有调用 opensub 方法。单击行模板时，我需要进入 opensub 方法，我可以在 dataBound 函数中执行此操作吗？

或任何其他方式？

【参考方案1】：

常见的方法是使用组件构建 AngularJS 应用程序。如果您创建一个包含网格的组件，那么您将能够从模板调用openSub() 方法：ng-click="$ctrl.openSub()"。在这种情况下，您方法中的this 将指向TypeCtrl。

【讨论】：

是的，因为元素是在模板中动态生成的，所以上下文没有获取控制器。我已经尝试在模板中使用“this”。但是，由于角度不知道“这个”