AngularJS - decorator - directive - adding delegate function

var app = angular.module('plunker', []);

app.controller('someCtrl', function ($scope) {
  var x = $scope.othervar1;
  
  $scope.$watch(function() {
    return $scope.othervar1;
  }, function(a,b) {
    debugger;
  }, true);
});

app.directive('mycustom', function() {
    return {
        restrict: 'E',
        scope: {
        },
        template: ""
    };
});

app.config(function($provide) {
    $provide.decorator('mycustomDirective',['$delegate','$controller', function($delegate, $controller) {
        var directive = $delegate[0];
        
        var compile = directive.compile;
        
        $delegate[0].$$isolateBindings["othervar"] = {
          attrName: "othervar",
          mode: "=",
          optional: true
        };
        
        angular.extend(directive.scope, {
            "othervar": "=?"
        });
        
        var link = directive.link;
        
        directive.compile = function () {
          
        return {
              pre: function (scope, element, attr, controller) {
                  debugger;
                   scope.othervar = {
                    bla: function() {
                      
                    }
                   }
                   
                  link.apply(this, arguments);               
              }
          };
        };
        
        return $delegate;  
    }]);
});   
 
angular.element(document).ready(function(){
  angular.bootstrap(document,['plunker']);
})

<!DOCTYPE html>
<html>
  <head>
    <script src="http://code.angularjs.org/1.3.0/angular.js"></script>  
  
      <script src="app.js"></script>
        
      </head>
  <body> 
  
    <div ng-controller="someCtrl">
    <mycustom othervar="othervar1"></mycustom>
    </div>
    
  </body>
</html>

/* Put your css in here */