angular 指令能否将参数传递给指令属性中指定的表达式中的函数? [英] Can an angular directive pass arguments to functions in expressions specified in the directive's attributes?

问题描述

我有一个表单指令，它使用具有隔离范围的指定 callback 属性:

I have a form directive that uses a specified callback attribute with an isolate scope:

scope: { callback: '&' }

它位于 ng-repeat 中，所以我传入的表达式包括对象的 id 作为回调函数的参数:

It sits inside an ng-repeat so the expression I pass in includes the id of the object as an argument to the callback function:

<directive ng-repeat = "item in stuff" callback = "callback(item.id)"/>

当我完成指令后，它会从其控制器函数中调用 $scope.callback().对于大多数情况，这很好，这就是我想要做的，但有时我想从 directive 本身内部添加另一个参数.

When I've finished with the directive, it calls $scope.callback() from its controller function. For most cases this is fine, and it's all I want to do, but sometimes I'd like to add another argument from inside the directive itself.

是否有允许这样做的角度表达式:$scope.callback(arg2)，导致 callback 被调用 arguments = [item.id, arg2]?

Is there an angular expression that would allow this: $scope.callback(arg2), resulting in callback being called with arguments = [item.id, arg2]?

如果没有，最简洁的方法是什么?

If not, what is the neatest way to do this?

我发现这有效:

<directive 
  ng-repeat = "item in stuff" 
  callback = "callback" 
  callback-arg="item.id"/>

与

scope { callback: '=', callbackArg: '=' }

和指令调用

$scope.callback.apply(null, [$scope.callbackArg].concat([arg2, arg3]) );

但我认为它不是特别整洁，它涉及在隔离范围内放置额外的东西.

But I don't think it's particularly neat and it involves puting extra stuff in the isolate scope.

有更好的方法吗?

Plunker 游乐场(打开控制台).

推荐答案

如果你像@lex82 提到的那样声明你的回调

If you declare your callback as mentioned by @lex82 like

callback = "callback(item.id, arg2)"

您可以使用对象映射在指令范围内调用回调方法，它会正确进行绑定.喜欢

You can call the callback method in the directive scope with object map and it would do the binding correctly. Like

scope.callback({arg2:"some value"});

不需要 $parse.查看我的小提琴(控制台日志)http://jsfiddle.net/k7czc/2/

without requiring for $parse. See my fiddle(console log) http://jsfiddle.net/k7czc/2/

更新:文档:

&或 &attr - 提供一种在上下文中执行表达式的方法父作用域.如果未指定属性名称，则属性名称假定与本地名称相同.范围的给定和小部件定义:{localFn:'&myAttr' }，然后隔离范围属性 localFn 将指向count = count + value 表达式的函数包装器.经常通过表达式从隔离范围传递数据是可取的和父作用域，这可以通过传递本地映射来完成变量名和值放入表达式包装器 fn 中.例如，如果表达式是 increment(amount) 那么我们可以指定数量通过将 localFn 调用为 localFn({amount: 22}) 来获取值.

& or &attr - provides a way to execute an expression in the context of the parent scope. If no attr name is specified then the attribute name is assumed to be the same as the local name. Given and widget definition of scope: { localFn:'&myAttr' }, then isolate scope property localFn will point to a function wrapper for the count = count + value expression. Often it's desirable to pass data from the isolated scope via an expression and to the parent scope, this can be done by passing a map of local variable names and values into the expression wrapper fn. For example, if the expression is increment(amount) then we can specify the amount value by calling the localFn as localFn({amount: 22}).

这篇关于angular 指令能否将参数传递给指令属性中指定的表达式中的函数?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！