I am computing/building a javascript object in a directive (component) and I want to pass it to another component. 

In my case, I am referring to the list of heroes that that is in the heroList.js (which is the source component), and I want to transfer the passingObject to the someOtherTabPage.js (which is the destination component).

This is the [link](https://plnkr.co/edit/9YF55ZZ6F0Jt2HuWUUoH?p=info) to my plunk. Can you please help with this problem, I don't what's wrong in binding the passingObject to between my two components?

```
(function(angular) {
  'use strict';
  function someOtherTabPageController($scope) {
    //do some work with the passingObject
    alert(JSON.stringify(passingObject));
  }

  angular.module('heroApp').component('someOtherTabPage', {
  templateUrl: 'someOtherTabPage.html',
  controller: someOtherTabPageController,
  bindings :{
    passingObject: '='
  }
});
})(window.angular);

```