How to trigger multiple Click events on one click angular js - angularjs

Question

I am having different ng-clicks events, I want all those to be triggered at once on click of a button
Example
<div ng-controller="one">
<input type="button" id="one" ng-click="firstBtnClick(a,b)" class="fstClass"/>
</div>
<div ng-controller="two">
<input type="button" id="two" ng-click="SecBtnClick(c,d)" class="SecClass"/>
</div>
<div ng-controller="three">
<input type="button" id="three" ng-click="ThirdBtnClick(e,f)" class="ThirdClass"/>
</div>
Now I want to hit all this click functions on other button
<div ng-controller="final">
<input type="button" id="final" ng-click="finalBtnClick" class="FinalClass"/>
</div>
Final Controller code
$timeout(function () {
angular.element('.fstClass', '.SecClass').triggerHandler('click');
}, 0);
But I am unable to achieve, Any suggestions??

Answer 1

Why do you want to do this in the view? You are calling controller functions with every button click.
So just have a ng-click="everyClick()" and inside this controller
function, call every function you want to call.
So:
$scope.finalBtnClick = function() {
$scope.firstBtnClick();
$scope.SecBtnClick();
$scope.ThirdBtnClick();
}

Answer 2

If the functions are in the same controller you can chain together like this:
<input type="button" id="final" ng-click="firstBtnClick+SecBtnClick+ThirdBtnClick" class="FinalClass"/>
For communication across controllers you can create and inject a shared service to each controller, nest controllers, use $rootscope or use $emit:
function FirstController($scope)
{
$scope.$on('clickFirst', function(event, args) {
firstBtnClick(args)//click first button
});
// another controller or even directive
}
function FinalController($scope)
{
$scope.$emit('clickFirst', args);
}