Trigger click en el div más cercano con angularJS

Hola tengo código de seguimiento:

angular.module("myApp", []).controller("myController", function($scope) { $scope.clickedInput = function() { setTimeout(function() { angular.element('.addon').triggerHandler('click'); }, 100); } $scope.clickedAddon = function(number) { console.log(number); } }); 
 .wrapper { display: flex; flex-direction: column; } .inputWithAddon { display: flex; margin-bottom: 10px; } input { height: 20px; } .addon { width: 26px; height: 26px; background-color: green; } 
  
1
2
3

Mi idea es que cuando hago clic en una entrada, fuerza un clic con triggerHandler() en el div verde del lado derecho e imprime su número. Solo debe forzar el clic del div verde, que está en el lado derecho de la entrada pulsada, no todos ellos. Escribí hoy una pregunta similar para JQuery: forzar el clic con el disparador () en la división más cercana.

Allí funciona bien con más soluciones posibles. ¿Cómo puedo hacer el mismo efecto con angularjs?

Gracias.

Pase $event a la función principal ng-click function y luego obtenga .parent() y luego el segundo hijo. Entonces dispara.

 var a = angular .element($event.target) .parent().children() angular .element(a[1]).triggerHandler('click'); 
 angular.module("myApp", []).controller("myController", function($scope) { $scope.clickedInput = function($event) { setTimeout(function() { var a = angular .element($event.target) .parent().children() angular .element(a[1]).triggerHandler('click'); }, 100); } $scope.clickedAddon = function(number) { console.log(number); } }); 
 .wrapper { display: flex; flex-direction: column; } .inputWithAddon { display: flex; margin-bottom: 10px; } input { height: 20px; } .addon { width: 26px; height: 26px; background-color: green; } 
  
1
2
3