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>'
};
});

目前没有调用convertIDRtoUSD方法。

在线阅读，我想我应该使用Isolate Scope“＆amp;”但到目前为止还没有成功。

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>'
};
});

需要注意的一些事项 - 函数的属性名称应该是“命名为”＆＃39;没有camel-case命名，并且传递给指令的函数的参数必须传递给具有命名值的对象。希望这有帮助！

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

1 个答案:

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

1 个答案:

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