Get return value in callback Angular js Directive

angularjs, angularjs-directive, callback

Solution

While calling the controller's function from inside a directive with an isolate scope, you need to pass an object:

HTML

<div ng-app="myApp" ng-controller="ctrl">
    <div abc-option get-display-name="getDisplayName(columnName)"></div>
</div>

JS

var app = angular.module('myApp', []);
function ctrl($scope){
    $scope.getDisplayName = function(columnName) {        
        return 'abc';
    };
}
app.directive('abcOption', function($compile,$timeout) {
    return {
        restrict : 'A',
        template : '<div class="filter-content">abc</div>',
        replace : true,
        scope : {
            callBackMethod:'&getDisplayName'
        },
        link: function(scope,element,attrs){            
            /* send an object to the function */
            console.log(scope.callBackMethod({columnName:"hurray"}));           
        }
    };
});

Fiddle

Problem

I have created one directive in Angularjs in which I need to use `callBackMethod`, so that I can call Controller's Function. Controller's function is called.But Controller's Function is returning some value.I want to get that value in callback function.How to achieve that? Below is my code for Directive ``` .directive('abcOption', function($compile) { return { restrict : 'A', template : '<div class="filter-content"></div>', replace : true, scope : { callBackMethod:'&getDisplayName' },link: function(scope,element,attrs) { scope.getDataName =function(dataId) { scope.callBackMethod(dataId); }; } }; }); ``` Below Code is for Controller function ``` $scope.getDisplayName = function(columnName) { return 'abc'; }; ``` It's small snippet of the code. Controller function is called but I am not getting return value in directive function. I am getting `undefined` in console log if I log `scope.callBackMethod(dataId)`; How to get return value using `callBackMethod` in Directive?

Original source