This is the communication setup between to controllers, one needs data from the other.

canvas-data-service.js

'use strict';

var canvasDataServices = angular.module('CanvasDataServices', []);

canvasDataServices.service('CanvasDataService', ['$rootScope', '$q',
  function CanvasDataService($rootScope, $q) {
    var canvasDataService = {};

    canvasDataService.requestCanvasJSON = function() {
      this.deferred = $q.defer();
      $rootScope.$emit('requestCanvasJSON');
      return this.deferred.promise;
    };

    canvasDataService.responseCanvasJSON = function(canvasJSON) {
      this.deferred.resolve(canvasJSON);
    };

    return canvasDataService;
  }
]);

canvas.js

'use strict';
var canvasControllers = angular.module('canvasControllers', []);

canvasControllers.controller('CanvasCtrl', ['$scope', '$rootScope', 'ImageDropService', 'CanvasDataService',
  function($scope, $rootScope, ImageDropService, CanvasDataService) {
    var canvasElement = document.getElementById('canvas-id');
    var canvasWidth = 580;
    var canvasHeight = 400;

    //console.log($scope);

    var canvas = new fabric.Canvas('canvas-id');

    $rootScope.$on('requestCanvasJSON', function() {
      console.log('requestedCanvasJSON')
      CanvasDataService.responseCanvasJSON($scope.canvas.toJSON());
    });
  }
]);

story.js

'use strict';

var storyControllers = angular.module('storyControllers', [])

storyControllers.controller('StoryEditorCtrl', ['$rootScope', '$scope', 'Story', 'CanvasDataService',
  function($rootScope, $scope, Story, CanvasDataService) {
    $scope.story = NewStory();

    $scope.save = function() {
      CanvasDataService.requestCanvasJSON().then(  // <-- thanks for this nikolaj_a
        function(json) {
          $scope.story.json = json;
        }
      );
    }
  }
]);