Skip to content Skip to sidebar Skip to footer

Pass Callback Function To Directive

I'm trying to pass a callback function from a controller to a directive. Here's the callback function code: $scope.onImageSelect = function(image) { alert('SET'); $scope.ca

Solution 1:

While calling the expression method from the directive you need to pass the parameter from the directive in JSON format, also you should correct your directive callback attribute value to pass function like callback="onImageSelect(image)"

Directive usage:

<google-image-searchcallback="onImageSelect(image)" />

Directive Template

<adata-ng-click="callback({image: url})"></a>

Solution 2:

Following code is tested and working..

Directive call in html

<taxcode-pickercall-back-fun="calculate_tax(a, b)"></taxcode-picker>

Sample Directive code

{
scope:'&',
link: function (scope, element, attrs) {
 scope.tax = {amount:12, rate:10.50};
 scope.obj = {number:12, value:10};

  scope.call_back = function (tax) {
    scope.callBackFun({a:tax, b:obj});
  }
}

}

Sample Controller

app.controller("sample", function($scope){
$scope.calculate_tax = function (tax, obj) {

        console.log("tax "+JSON.stringify(tax));

        console.log("obj "+JSON.stringify(obj));
    }
});

Solution 3:

Simply use:

<google-image-searchcallback="onImageSelect(image)" />

This example from AngularJS developer guide is pretty similar to your case: http://plnkr.co/edit/hYBxk070sgw54RElyWNq?p=preview

Solution 4:

try to change the scope object to be like this

scope: {
        callback: '='
    }

and it will work

Post a Comment for "Pass Callback Function To Directive"