Access controller function from directive

I have a main controller: MainCtrl and a function within it: $scope.ctrlFn

This function expects an argument and returns a string concatenated to the received argument value.

MainCtrl JS:

app.controller('MainCtrl', ['$scope', '$http', '$log', '$timeout', function ($scope, $http, $log, $timeout) {
      $scope.ctrlFn = function(x) {
          return 'some val'+x;
      };

      var customTemp = '<div ng-repeat="c in grid.appScope.someArray">{{c}}<my-directive url="MODEL_COL_FIELD" vvv="ctrlFn(url)"  /></div>';
      $scope.someArray=['a','b','c'];      
      $scope.gridOptions = {};

      $http.get('https://cdn.rawgit.com/angular-ui/ui-grid.info/gh-pages/data/500_complex.json')
        .success(function(data) {
          $scope.gridOptions.data = data;

        });
      $scope.gridOptions.rowHeight = 50;  
      $scope.gridOptions.columnDefs = [

        { name:'eee' },
        { name:'age'  },
        { name:'address.street'}
      ];
      $scope.gridOptions2 = {};
      $scope.gridOptions2.data =[];
      $scope.gridOptions2.rowHeight =400;
      $scope.gridOptions2.columnDefs =[];

      var timer = function() {
        for (i = 1; i < 100; i++) { 
          $scope.gridOptions2.data.push({
            value:i,
            name:'Name'+i,
            url:'https://dummyimage.com/30x30/000/fff&text='+i,
            image:i
          });

        }

        $scope.gridOptions2.columnDefs =[
          {
            name:'image',
            cellTemplate:customTemp,
            width:100
          },
          {
            name:'name',
            cellTemplate:customTemp,
            width:100
          },
          {
            name:'url',
            width:50
          },
          {
            name:'value'
          }
        ];

      };

      $timeout(timer,0);
      console.log($scope.gridOptions);
      console.log($scope.gridOptions2);
    }]);

I have a directive: myDirective which creates a template and initiates scope values from parent scope variables and functions and displays them. I have managed to pass the scope variables to directive template like with scope url but not the value myValue which is meant to be assigned the value returned from the parent function.

Directive myDirective:

app.directive('myDirective', function ($log) {

    return {
        restrict: 'E',
        replace: true,

        scope: {
          url: '=',
          vvv: '&'
        },

        template: '<div ng-init="u=url; myValue=vvv" >{{u}}-{{myValue}}<img  src="https://dummyimage.com/100x100/000/fff&text={{url}}" alt="Smiley face" height="100" width="100"></div>',
        link: function (scope, element, attrs) {

          scope.$watch('url', function(newValue) {
            var url = newValue;
          });
        }
    };
});

Here is a plunker: http://plnkr.co/edit/yXE3AuZEPwjlmlqpFTNq?p=preview