如何从指令传递参数给控制器？

Question

我的HTML看起来像这样

<td currency-convert idrVal="{{(btcAsk.btcValue * btcAsk.btcAmnt).toFixed(2)}}"></td> 

的AngularJS代码

控制器具有方法：

$scope.convertIDRtoUSD = function(idrValue) { 

    return CurrencyConversions.convertToUSD(idrValue, 'IDR'); 
}; 

而且该指令的样子..

bitcoinApp.directive("currencyConvert", function() { 
return { 
    restrict: 'A', 
    scope: { 
     idrval: '@' 
    }, 
    template: '<span class="has-tip" tooltip="convertIDRtoUSD({{idrval}})" tooltip-animation="false">{{idrval}}</span>' 
}; 
}); 

这是curren没有调用convertIDRtoUSD方法。

在线阅读，我想我应该使用隔离范围“&”，但迄今为止尚未取得成功。

Answer 1

好吧，我会尽力把这句话尽可能地说出来，这样对我一无所知！你的模板包含一个方法。在运行时，它期望这个方法出现在当前范围内。但是，在这一点上，范围是您使用指令创建的独立范围，并且仅包含idrval的值，因此该方法未定义。

您需要要么功能convertIDRtoUSD（）添加到该指令的范围，或通过功能为您的指令与idrval一起。如果选择前者，找你的指令可能是这样的：

bitcoinApp.directive("currencyConvert", function() { 
return { 
    restrict: 'A', 
    scope: { 
     idrval: '@' 
    }, 
    template: '<span class="has-tip" tooltip="convertIDRtoUSD({{idrval}})" tooltip-animation="false">{{idrval}}</span>', 
    link: function(scope) { 
     scope.convertIDRtoUSD = function(idrValue) { 
      return CurrencyConversions.convertToUSD(idrValue, 'IDR'); 
     }; 
    } 
}; 
}); 

如果你想传递的功能，控制器上的功能存在，你的HTML代码将是这个样子：

<td currency-convert my-func="convertIDRtoUSD(val)" idrVal="{{(btcAsk.btcValue * btcAsk.btcAmnt).toFixed(2)}}"></td> 

而且你的指令：

bitcoinApp.directive("currencyConvert", function() { 
return { 
    restrict: 'A', 
    scope: { 
     idrval: '@', 
     myFunc: '&' 
    }, 
    template: '<span class="has-tip" tooltip="myFunc({val: idrval})" tooltip-animation="false">{{idrval}}</span>' 
}; 
}); 

需要注意以下几点 - 功能的属性名应该是“短跑名为”不驼峰命名，并给函数的参数传入指令必须传递一个具有命名值的对象。 希望这有助于！