在UI网格链接中调用范围函数

Question

在UI网格链接中调用范围函数

use*_*828 4 javascript angularjs angular-ui-grid

我正在使用UI-Grid制作表格.我想在单击单元格的内容时调用范围函数.在这种情况下,单击单元格时,应显示警报.这是我的javascript文件.

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

app.controller('MainCtrl', ['$scope', '$http', '$interval', '$q', function ($scope, $http, $interval, $q) {
    $scope.gridOptions = {};

    $scope.gridOptions.columnDefs = [{name: 'ID', field: 'id', cellTemplate: '<a ng-href="#" ng-click="test()">{{row.entity.id}}</a>'}];

    $scope.test = function() {
        window.alert("Alert");
    }

}]);

Run Code Online (Sandbox Code Playgroud)

我的网页:

<!doctype html>
<html ng-app="app" class="ng-scope">
  <head>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.16/angular.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.16/angular-touch.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.16/angular-animate.js"></script>
    <script src="http://ui-grid.info/docs/grunt-scripts/csv.js"></script>
    <script src="http://ui-grid.info/docs/grunt-scripts/pdfmake.js"></script>
    <script src="http://ui-grid.info/docs/grunt-scripts/vfs_fonts.js"></script>
    <script src="http://ui-grid.info/release/ui-grid.js"></script>
    <script src="app.js"></script>
    <link rel="stylesheet" href="http://ui-grid.info/release/ui-grid.css" type="text/css">

    <style type="text/css">
    .grid {
        width: auto;
        height: 500px;
        margin-left: 50px;
        margin-right: 50px;
        margin-top: 50px;
        margin-bottom: 50px;
    }
    </style>

  </head>
  <body>

<div ng-controller="MainCtrl">
  <div id="grid0" ui-grid="gridOptions" ui-grid-exporter ui-grid-selection class="grid"></div>

</div>

  </body>
</html>

Run Code Online (Sandbox Code Playgroud)

这不起作用,我无法弄清楚为什么.

Answer 1

Kat*_*hir 5

要从模板调用$ scope level函数,您必须使用grid.appScope.在你的情况下它将是grid.appScope.test()

cellTemplate: '<a ng-href="#" ng-click="grid.appScope.test()">{{row.entity.Locked}}</a>'

Run Code Online (Sandbox Code Playgroud)

这里的示例http://plnkr.co/edit/KyxhAXQVYPfnZPcNh9Ce?p=preview

归档时间：	10 年，3 月前
查看次数：	3016 次
最近记录：	9 年，7 月前