passing data to another controller using $rootScope.$broadcast

Question

its like signup menu first controller gets the data from the user and after the validation it sends the data to $rootScope and broadcast it so the second controller can get it and show the data in myInfo tab

don't know whats wrong but the second controller cant get the data

first controller

(function() {
  "use strict";
  angular.module("public").controller("SignUpController", SignUpController);
      SignUpController.$inject = ["$rootScope"];
      function SignUpController($rootScope) {
        let signUpCtrl = this;
        signUpCtrl.name = "";
        signUpCtrl.email = "";

        signUpCtrl.submit = () => {

          signUpCtrl.formSbmitted = true;

          $rootScope.$broadcast("user:created", {
            name: signUpCtrl.name,
            email: signUpCtrl.email
          });
        };
      }
})();

second controller

(function() {
  "use strict";
  angular.module("public").controller("MyInfoController", MyInfoController);
      MyInfoController.$inject = ["$rootScope"];
      function MyInfoController($rootScope) {
        let myInfo = this;

        $rootScope.$on("user:created", function(event, data) {
          myInfo.data = data;
        });
      }
})();