Multiple Scopes - JS

scopes.html

<!--Parent Controller-->
<div ng-controller="ParentController">
  <!--First Child Controller-->
  <div ng-controller="ChildAController">
    <button ng-click="handleClick()">Click This</button>
  </div>
  
  <!--Second Child Controller-->
  <div ng-controller="ChildBController">
    <button ng-click="handleClick()">Click This</button>
  </div>
</div>

scopes.js

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

app.controller('ParentController', function($scope){
  
});

app.controller('ChildAController', function($scope, fooService){
  
  $scope.handleClick = function(e){
    doControllerSpecificThings();
    fooService.doAGenericThing();
  };
  
  function doControllerSpecificThings(){
    //things that are for this controller  here
  }
});

app.controller('ChildBController', function($scope, fooService){
  
  $scope.handleClick = function(e){
    doControllerSpecificThings();
    fooService.doAGenericThing();
  };
  
  function doControllerSpecificThings(){
    //things that are for this controller  here
  }
});

app.factory('fooService', function(){
  
  return {
    doAGenericThing : function(){
      console.log("Don't cry anymore. This is how you share code.");  
    }  
  };
  
});

Don't do this. Use a service.