时间戳

首页 > 解决方案 > AngualrJs：我需要在我的控制器中使用 $scope 吗？

angularjs - AngualrJs：我需要在我的控制器中使用 $scope 吗？

问题描述

我正在尝试模仿这个 Plunker，特别是在 ag-grid 的每一行中添加一个按钮。

function ageClicked(age) {
    window.alert("Age clicked: " + age);
}

function ageCellRendererFunc(params) {
    params.$scope.ageClicked = ageClicked;
    return '<button ng-click="ageClicked(data.age)">Age</button>';
}

Ag-grid 调用ageCellRendererFunc渲染单元格。它正在生成一些 HTML 来显示一个按钮，单击该按钮将导致ageClicked被调用。

这params.$scope.ageClicked = ageClicked;似乎是在分配一个$scope变量，该变量在按钮代码中使用：'<button ng-click="ageClicked(data.age)">Age</button>'.

我不确定为什么需要分配一个$scope变量，以及为什么我们不能只引用一个$scope函数。可以这样做吗？

更重要的是，我没有注入$scope到我的控制器中，因为我使用constroller as了视图中的语法。

如何ag-grid使用语法让类似的代码工作，向单元格添加 HTML 按钮controller as？

[更新] 上面提到的 Plunker 使用了非常旧的 ag-grid 版本。

  1. 我想使用最新版本，v22
  2. 我不想使用$scopeor $rootscope，只是this和controller as语法
  3. 每行应包含一个单元格，该单元格显示一个按钮，单击该按钮时，将执行以 soem 行数据作为参数的功能（就像 Plunker 中的“年龄”，但在此列表中满足 1 和 2）

标签： angularjsangularjs-scopeag-grid

解决方案

里面(plunker $scope)ag-grid

在它调用之前ageCellRendererFunc

function ageCellRendererFunc(params) {
    params.$scope.ageClicked = ageClicked;
    eturn '<button ng-click="ageClicked(data.age)">Age</button>';
 }

它初始化params（4012）：

RenderedCell.prototype.createParams = function () {
            var params = {
                node: this.node,
                data: this.node.data,
                value: this.value,
                rowIndex: this.rowIndex,
                colDef: this.column.colDef,
                $scope: this.scope, // <----
                context: this.gridOptionsWrapper.getContext(),
                api: this.gridOptionsWrapper.getApi()
            };
            return params;
        };

所以你可以使用controller as

module.controller("exampleCtrl", function($http) {
  var vm = self;
  /* ... */
 }

带 vm 的柱塞

编辑 1

这是一个使用 ag-grid 22.0.0 的plunker

（已添加agGrid.initialiseAgGridWithAngular1(angular)）

这段代码很好：

function ageCellRendererFunc(params) {
    params.$scope.ageClicked = ageClicked;
    return '<button ng-click="ageClicked(data.age)">Age</button>';
 }

正如您所提到$scope的，与您的控制器有关，params而不是您的控制器。您的控制器根本不使用$scope。这是 ag-grid 的定义。开发人员可以使用另一个变量 -bob语法将是params.bob.ageClicked = ageClicked;

推荐阅读