将$ scope传递给ng-click内的对象存储函数

时间:2016-06-29 19:01:56

标签: angularjs

好的,我不确定如何描述这个问题,但我们试一试。

我有一个角度控制器,可以根据给定的值使用不同的数据源。

var RowCtrl = function($scope, RowService, $http, $timeout, $compile){
    $scope.rows = RowService.getRows();
    $scope.columns = RowService.getColumns();
    $scope.search = function()
    ...
    $scope.insert = function()
    ...
    etc...

必须为注入的RowService提供行和列值

还有一个MailController,显示允许发送电子邮件的表单。

在不同的页面中,我的代码看起来或多或少像这样:

app.controller('EmployeesController', function($scope, $controller) {
        angular.extend(this, $controller('RowCtrl', {$scope: $scope}));
        angular.extend(this, $controller('MailCtrl', {$scope: $scope}));
    });
    app.value("rows", <?php echo json_encode($empleados); ?>);
    app.value("columns", [
        {name:"id", view:false, pk:true},
        {name:"nombre", view:false, mandatory:true},
        {name:"apellidos", view:false, mandatory:true},
        {name:"empleado", label:"Empleado", main:true, value:function(){ return this.nombre+" "+this.apellidos; }, create:false, edit:false},
        {name:"email", label:"Email", click:function(row){ mailForm({toName:row.nombre+" "+row.apellidos, to:row.email }); }},
        {name:"telefono", label:"Teléfono"}
    ]);

如果您查看“电子邮件”列,我添加了一个点击属性,因此我可以在不同的列上声明自定义事件。

这是使用它的模板:

<div class = 'col' ng-repeat = 'column in columns  | filter: {view:"!false", main:"!true"}'>
    <a ng-if = 'column.click' ng-click = 'column.click(row)'>{{getCellValue(row, column)}}</a>
    <p ng-if = '!column.click'>{{getCellValue(row, column)}}</p>
</div>

所以,它确实有效,因为我定义了一个mailForm函数,但我更喜欢让MailCtrl来处理这个操作,所以问题是,有什么方法可以做这样的事情吗? (调用函数时参考当前范围):

...
{name:"email", label:"Email", click:function(row){ $scopeWhereTheFunctionWasCalled.mail()  }}
...

先谢谢,不要残忍,第一个角度项目:)

1 个答案:

答案 0 :(得分:1)

要调用$scope中定义的函数,您需要在列[]中定义函数,如下所示:

$scope.columns = [{
 name: "id",
 view: false,
 pk: true,
}, {
 name: "nombre",
 view: false,
 mandatory: true
}, {
 name: "apellidos",
 view: false,
 mandatory: true
}, {
 name: "empleado",
 label: "Full Name",
 main: true,
 value: function() {
  return this.nombre + " " + this.apellidos;
 },
 create: false,
 edit: false
}, {
 name: "email",
 label: "Email",
 click: function(row) {
  $scope.mailForm({
    toName: row.nombre + " " + row.apellidos,
    to: row.email
  });
 }
}, {
 name: "telefono",
 label: "Telephone"
}];

这是codepen

上的工作示例