1

背景：当AngularJS指令的代码中发生某些事情时，我正在尝试运行回调。

相关代码：

HTML：

<img-cropper onselect="updateAvatarData" x="100" y="100" src="{{tempAvatar}}" id="avatarCropper"/>

控制器：

$scope.updateAvatarData = function(c){
    alert("¡¡¡Funciona!!!!");
};

指示：

<<more code up here>>

link: function(scope,element, attr) {
  scope.wsId = attr.id+'WS';
  scope.pvId = attr.id+'preview';
  scope.x = attr.x;
  scope.y = attr.y;
  scope.aspectRatio = scope.x/scope.y;
  scope.previewStyle = "width:"+scope.x+"px;height:"+scope.y+"px;overflow:hidden;";
  scope.onSelectFn = scope.$eval(attr.onselect);

<<more code down here>>

问题在于最后一行“scope.onSelectFn = scope.$eval(attr.onselect);”。那个“scope.$eval(attr.onselect);” 返回“未定义”。attr.onselect 工作正常，它返回在“onselect”属性上键入的函数的名称。

我已经使用通过属性传递的函数制作了其他指令，没有问题，但我无法在这里找到我做错了什么。

  • 提前致谢
4

3 回答 3

3

当您可以轻松使用 Angular 提供的“&”功能时，为什么要这样做

从AngularJS中的指令调用父控制器的方法

不过，如果您想像这样调用父函数，那么您应该使用 $parse 而不是 eval 使用时请参见下面的小示例

  link: function (scope,element,attrs) {
                   var parentGet = $parse(attrs['onselect']);

                   var fn = parentGet(scope.$parent);
                   fn();

               },
于 2013-06-06T20:08:55.710 回答
2

scope.$eval(attr.onselect)应该管用。

这是一个具有最小链接功能的工作小提琴（在 Chrome 中测试）：

link: function(scope, element, attr) {
    scope.onSelectFn = scope.$eval(attr.onselect);
    console.log(attr.onselect, ',', scope.onSelectFn);
    scope.onSelectFn();
},

我唯一能想到的另一件事是，既然onselect是 HTML 属性，也许它在其他一些浏览器上不起作用。所以也许尝试使用不同的属性名称。

于 2013-06-07T03:53:42.417 回答
1

默认情况下，$eval仅针对当前范围评估给定的表达式。您可以传入不同的数据对象进行评估，在您的情况下，它是父范围。你应该这样称呼它：

scope.onSelectFn = scope.$eval(attr.onselect, scope.$parent);

请参阅此处的文档

于 2017-03-29T21:41:59.273 回答