加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

在单元格模板中的anglejs-ng-click不会在控制器中触发功能

发布时间:2020-12-17 09:53:04 所属栏目:安全 来源:网络整理
导读:我在这里创造了一个洞穴: http://plnkr.co/edit/zGqouwzxguef13lx48iP?p=preview 当我在日视图中单击ui-grid的单元格时,没有任何反应.我期望的是测试功能被执行,并且用文本’test’显示警报,但情况并非如此. 这里发生了什么事? 这是ui-grid 3.0最新版本的h
我在这里创造了一个洞穴: http://plnkr.co/edit/zGqouwzxguef13lx48iP?p=preview

当我在日视图中单击ui-grid的单元格时,没有任何反应.我期望的是测试功能被执行,并且用文本’test’显示警报,但情况并非如此.

这里发生了什么事?

这是ui-grid 3.0最新版本的html单元格模板:

HTML

<div ng-click="test()" ng-switch="row.entity[row.grid.columns.indexOf(col)].isPeriod">

    <div ng-switch-when="true">
        <tabset>
            <tab>
                <tab-heading>
                    <i class="glyphicon glyphicon-book"></i>
                </tab-heading>period id:
                {{ row.entity[row.grid.columns.indexOf(col)].id}}
            </tab>
            <tab select="alertMe()">
                <tab-heading>
                    <i class="glyphicon glyphicon-bell"></i>
                </tab-heading>
                {{row.entity[row.grid.columns.indexOf(col)].content}}
            </tab>

        </tabset>      <!-- PeriodTemplate -->
    </div>
    <div ng-switch-when="false">
       <div>Hello empty template</div>
    </div>      <!-- EmptyPeriodTemplate -->
</div>

控制器:

'use strict';
angular.module('projectplanner').controller('DateplannerDayController',function ($scope,$state) {


    var columnHeaderDates = ['col1','col2','col3','col4','col5','col6','col7']
    $scope.columns = createColumnHeaders(columnHeaderDates);

var data = [{isPeriod: true,id: 10,rowNumber: 1},{isPeriod: false,id: 11,rowNumber: 2}]

  $scope.test = function()
  {
    alert('test');
  };

    $scope.gridOptions = {
        rowHeight: 200,data: data,enableSorting: false,enableColumnMenu: false,columnDefs: $scope.columns,onRegisterApi: function (gridApi) {
            $scope.gridApi = gridApi;
            $scope.gridApi.core.addRowHeaderColumn(
                { name: 'rowHeaderCol',displayName: '',width: 100,cellTemplate: '<div>row header template</div>'
                });
        }
    };

    function createColumnHeaders(columnHeaders) {
        var columnDefinitions = [];
        for (var i = 0; i < columnHeaders.length; i++) {
            var column = {
                name: columnHeaders[i],cellTemplate: 'lessonplanner.day.celltemplate.html',field: i + 'x'
            }
            columnDefinitions.push(column);
        }
        return columnDefinitions;
    }
});
这个页面保持弹出我的搜索,我设法错过了评论中的解决方案.总而言之,您可能需要使用externalScopes.见 Angular ui-grid events in cell header not firing和 http://ui-grid.info/docs/#/tutorial/305_appScope

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读