微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

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

在这里创造了一个洞穴: 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 firinghttp://ui-grid.info/docs/#/tutorial/305_appScope

原文地址:https://www.jb51.cc/angularjs/140410.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐