title: Angular.js return value from directive to controller
body: <p>I have a problem with directive. I found this plugin: <a href="http://allensarkisyan.github.io/VideoFrame/">http://allensarkisyan.github.io/VideoFrame/</a>, now I have this plugin implementation in my controller:</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;div class="row" ng-controller="searchDetailCtrl"&gt;
  &lt;section id="videoContainer"&gt;
      &lt;video id="videoPlayer" width="100%" controls src="asset/tc3.mp4" type="video/mp4"&gt;
      &lt;/video&gt;
  &lt;/section&gt;
  
  &lt;section id="videoControls"&gt;
      &lt;div class="row more-margin-bottom" ng-repeat="asset in AssetDetail"&gt;
          &lt;div class="col-sm-12"&gt;
              &lt;button ng-click="playVideo()" class="btn btn-large btn-inverse"&gt;&lt;i class="fa fa-play-circle fa-2x"&gt;&lt;/i&gt;&lt;/button&gt;
                  &lt;button ng-click="pauseVideo()" class="btn btn-large btn-inverse"&gt;&lt;i class="fa fa-pause fa-2x"&gt;&lt;/i&gt;&lt;/button&gt;
                  &lt;button ng-click="seekBackward()" class="btn btn-large btn-inverse"&gt;&lt;i class="fa fa-step-backward fa-2x"&gt;&lt;/i&gt;&lt;/button&gt;
                  &lt;button ng-click="seekForward()" class="btn btn-large btn-inverse"&gt;&lt;i class="fa fa-step-forward fa-2x"&gt;&lt;/i&gt;&lt;/button&gt;
                  &lt;button id="markIn" ng-click="markIn()"&gt;MARKIN&lt;/button&gt;
                  &lt;button id="markOut" ng-click="markOut()"&gt;MARKOUT&lt;/button&gt;
                  &lt;button id="savePicture" ng-click="createPreviewScreenShot()"&gt;PICTURE&lt;/button&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/section&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CONTROLLER</p>
  
  <pre><code>mwm3.controller('newSegmentationCtrl', function($scope, $timeout, SegmentationService, $route) 
  {
      var jsonTimecodeArr = [];
      var jsonPictureArr = [];
      var pictureObj = new Object();
      var LogicalMedia = new Object();
      var LogicalMediaDetail = new Object();
      var Segment = new Object();
      var sequenceNumber = 0;
      var markInTime, markOutTime;
      var PictureJson;
      var timecodeJson;
      LogicalMediaDetail.Segment = [];
      $('#markIn').addClass('animated').addClass('bounce');
      $('#markOut').prop('disabled', true);
      $('#savePicture').prop('disabled', true);
      SegmentationService.connect();
      SegmentationService.subscribe(function(message) 
      {
          var obj;
          try 
          {
              //$scope.ocw.push(message);
              obj = eval("(function(){return " + message + ";})()");
              console.log(message);
  
              // $location.url('/searchDetail');
          } catch (e) {
              obj = eval("(function(){return " + message + ";})()");
              alert(obj.Error);
          }
      });
      var video = new VideoFrame({
      id: 'videoPlayerSegmentation',
      frameRate: 25,
      callback: function(response) {
          console.log(response);
      }
  });
  
  $scope.playVideo = function() {
      video.video.play();
  };
  
  $scope.pauseVideo = function() {
      video.video.pause();
  };
  $scope.seekForward = function() {
      video.seekForward('', video.triggerFrameUpdate);
  };
  
  $scope.seekBackward = function() {
      video.seekBackward('', video.triggerFrameUpdate);
  };
  
  $scope.markIn = function() {
      markInTime = video.toSMPTE();
      var typeCut = 'MARKIN';
      jsonTimecodeArr.push('{ "frame": "' + markInTime + '" , "typeCut": "' + typeCut + '" }');
      timecodeJson = buildJSON();
      $scope.timecodeList = timecodeJson;
      $scope.$apply;
  
      $('#markIn').prop('disabled', true);
      $('#markOut').prop('disabled', false);
      $('#markIn').removeClass('animated').removeClass('bounce');
      $('#markOut').addClass('animated').addClass('bounce');
      $.notify("MARKIN ESEGUITO", "success");
  };
  
  $scope.markOut = function() {
      markOutTime = video.toSMPTE();
      var s = verifyTimecode(markOutTime, markInTime);
      var the_char = s.charAt(0);
  
      if (the_char != '-') {
          var typeCut = 'MARKOUT';
          jsonTimecodeArr.push('{ "frame": "' + markOutTime + '" , "typeCut": "' + typeCut + '" }');
          timecodeJson = buildJSON();
          $scope.timecodeList = timecodeJson;
          $scope.$apply;
  
          $('#markOut').prop('disabled', true);
          $('#savePicture').prop('disabled', false);
          $('#markOut').removeClass('animated').removeClass('bounce');
          $('#savePicture').addClass('animated').addClass('bounce');
          $.notify("MARKOUT ESEGUITO", "success");
          sequenceNumber++;
      } else {
          $.notify("ATTENZIONE IL TIMECODE MARKOUT E' INFERIRE AL MARKIN", "error");
      }
  };
  
  
  $scope.createPreviewScreenShot = function() {
      var c = video.toSMPTE(),
      a = document.createElement("canvas");
      a.width = video.video.videoWidth;
      a.height = video.video.videoHeight;
      a.getContext("2d").drawImage(video.video, 0, 0);
      a = a.toDataURL("image/jpeg");
      pictureObj.Image = a;
      pictureObj.Timecode = c;
      jsonPictureArr.push('{ "Image": "' + a + '" , "Timecode": "' + c + '" }');
      PictureJson = buildJSONPicture();
      $scope.imagesList = PictureJson;
      $scope.$apply;
      console.log(PictureJson);
      $('#savePicture').prop('disabled', true);
      $('#savePicture').removeClass('animated').removeClass('bounce');
      $('#saveSingleSegment').removeClass('noDisplay').addClass('animated').addClass('bounce');
  
  };
  
  $scope.deleteSegment = function() {
      $('#markIn').prop('disabled', false);
      $('#markOut').prop('disabled', false);
      $('#saveSingleSegment').removeClass('fadeInDown').addClass('noDisplay');
      $.notify("ELIMINAZIONE SEGMENTAZIONE ESEGUITA CON SUCCESSO", "success");
      markInTime = '';
      markOutTime = '';
  };
  
  $scope.buildSingleSegment = function() {
      if ($scope.segmentName) {
          Segment.Sequence = sequenceNumber;
          Segment.Name = $scope.segmentName;
          Segment.SegmentImage = pictureObj.Image;
          Segment.TimeCodeIn = markInTime;
          Segment.TimeCodeOut = markOutTime;
          LogicalMediaDetail.Segment.push({
              Sequence: Segment.Sequence,
              Name: Segment.Name,
              SegmentImage: Segment.SegmentImage,
              TimeCodeIn: Segment.TimeCodeIn,
              TimeCodeOut: Segment.TimeCodeOut
          });
          $('#markIn').prop('disabled', false);
          $('#markOut').prop('disabled', false);
          $('#savePicture').prop('disabled', false);
          $('#markIn').addClass('animated').addClass('bounce');
          $('#saveSingleSegment').removeClass('animated').removeClass('bounce').addClass('noDisplay');
          $.notify("SEGMENTAZIONE SALVATO CON SUCCESSO", "success");
      } else {
          $.notify("INSERIRE IL NOME DELLA SEGMENTAZIONE", "info");
      }
  }
  
  $scope.sendSegment = function() {
      LogicalMediaDetail.Id = 0;
      LogicalMediaDetail.AssetId = idAssetSegmentation;
      LogicalMediaDetail.Name = $scope.segmentationName;
      LogicalMedia.LogicalMedia = LogicalMediaDetail;
      var myString = JSON.stringify(LogicalMedia);
      SegmentationService.send(myString);
      console.log(myString);
      $.notify("SEGMENTAZIONE SALVATA CON SUCCESSO", "success");
      $route.reload();
  };
  
  $scope.remove = function(image) {
      var index = $scope.imagesList.indexOf(image);
      var index2 = jsonPictureArr.indexOf(image);
      if (index != -1) {
          $scope.imagesList.splice(index, 1);
      }
      if (index2 != -1) {
          jsonPictureArr.splice(index, 1);
      }
  };
  
  function verifyTimecode(markOut, markIn) {
      var ms = moment(markOut, "HH:mm:ss:ms").diff(moment(markIn, "HH:mm:ss:ms"));
      var d = moment.duration(ms);
      var s = Math.floor(d.asHours()) + moment.utc(ms).format("HH:mm:ss:ms");
  
      return s;
  }
  
  function buildJSON() {
      var b = "[" + jsonTimecodeArr.join(",") + "]";
      return JSON.parse(b)
  }
  
  function buildJSONPicture() {
      var b = "[" + jsonPictureArr.join(",") + "]";
      return JSON.parse(b)
  }
  
  function getScreenShot() {
      var c = video.toSMPTE(),
      a = document.createElement("canvas");
      a.width = video.video.videoWidth;
      a.height = video.video.videoHeight;
      a.getContext("2d").drawImage(video.video, 0, 0);
      a = a.toDataURL("image/jpeg");
  }
  </code></pre>
  
  <p>});</p>
  
  <p>I want to convert this in directive to reuse it in other page but I don't understand how I can return the values ​​that are now in my controller $scope function from the directive.</p>
  
  <p>For example, in my controller i have:</p>
  
  <pre><code>$scope.markIn = function() {
      markInTime = video.toSMPTE();
      .....
  };
  </code></pre>
  
  <p>I want to return markInTime from directive to my controller.</p>
  
  <p>you can help me understand?</p>
  
  <p>thanks in advance</p>
  
  <p>ADDITIONAL INFORMATION</p>
  
  <p>HTML</p>
  
  <pre><code> &lt;div ng-controller="TestPlayerCtrl"&gt;
      &lt;div my-directive my-directive-fn="controllerFunction"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CONTROLLER</p>
  
  <pre><code>    mwm3.controller("TestPlayerCtrl", function($scope){
    $scope.controllerFunction = function(valueFromDirective){
       console.log(valueFromDirective);
     }
  });
  </code></pre>
  
  <p>DIRECTIVE</p>
  
  <pre><code>    mwm3.directive("myDirective", function(){
    return {
     scope: {
       "myDirectiveFn": "="
     },
     link: function($scope){
       $scope.somethingHappend = function(){
         $scope.myDirectiveFn("pass this string");
       }
     }
    }
  });
  </code></pre>
  
  <p>but I don't see any output in the console. Thanks in advance</p>