ngClick을 프로그래밍 방식으로 트리거하는 방법

ngClick을 프로그래밍 방식으로 트리거하는 방법

트리거하고 싶다ng-click실행 시 요소의 예를 들어 다음과 같습니다.

_ele.click();

또는

_ele.trigger('click', function());

이것이 어떻게 행해지는가?

구문은 다음과 같습니다.

function clickOnUpload() {
  $timeout(function() {
    angular.element('#myselector').triggerHandler('click');
  });
};

// Using Angular Extend
angular.extend($scope, {
  clickOnUpload: clickOnUpload
});

// OR Using scope directly
$scope.clickOnUpload = clickOnUpload;

Angular Extend way에 대한 자세한 내용은 여기를 참조하십시오.

이전 버전의 angular를 사용하는 경우 triggerHandler 대신 트리거를 사용해야 합니다.

전파를 정지할 필요가 있는 경우는, 다음과 같이 이 방법을 사용할 수 있습니다.

<a id="myselector" ng-click="clickOnUpload(); $event.stopPropagation();">
  Something
</a>

angular.element(domElement).triggerHandler('click');

편집: 현재 $apply() 사이클에서 벗어나야 할 것 같습니다.이를 위한 한 가지 방법은 $timeout()을 사용하는 것입니다.

$timeout(function() {
    angular.element(domElement).triggerHandler('click');
}, 0);

http://jsfiddle.net/t34z7/ 를 참조해 주세요.

다음 솔루션이 도움이 됩니다.

angular.element(document.querySelector('#myselector')).click();

대신:

angular.element('#myselector').triggerHandler('click');

혹시 모르니까 이벤트 전파를 방해하지 않는 중요한 행과 중복되는 답변을 추가했습니다.

$scope.clickOnUpload = function ($event) {    
    $event.stopPropagation(); // <-- this is important

    $timeout(function() {
        angular.element(domElement).trigger('click');
    }, 0);
};

이전 JavaScript를 사용하는 것이 나에게는 효과가 있었다.
document.querySelector('#elementName').click();

최적의 솔루션은 다음과 같습니다.

domElement.click()

angularjs trigger Handler()가 원인입니다.angular.element(domElement).triggerHandler('click')) 클릭 이벤트는 DOM 계층에서는 표시되지 않지만 위의 이벤트는 일반 마우스 클릭과 마찬가지로 버블됩니다.

https://docs.angularjs.org/api/ng/function/angular.element

http://api.jquery.com/triggerhandler/

https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/click

당신은 할 수 있다

$timeout(function() {
   angular.element('#btn2').triggerHandler('click');
});

이 코드는 동작하지 않습니다(클릭하면 에러가 발생합니다.

$timeout(function() {
   angular.element('#btn2').triggerHandler('click');
});

다음과 같이 querySelector를 사용해야 합니다.

$timeout(function() {
   angular.element(document.querySelector('#btn2')).triggerHandler('click');
});

간단한 샘플:

HTML

<div id='player'>
    <div id="my-button" ng-click="someFuntion()">Someone</div>
</div>

자바스크립트

$timeout(function() {
    angular.element('#my-button').triggerHandler('click');
}, 0);

이게 뭘 하는지는 버튼의id클릭 액션을 수행합니다.보일라.

출처 : https://techiedan.com/angularjs-how-to-trigger-click/

클릭 이벤트를 트리거할 메서드에 다음 행을 포함합니다.

angular.element('#btn_you_want_to_click_progmaticallt').triggerHandler('click');
});

언급URL : https://stackoverflow.com/questions/22447374/how-to-trigger-ngclick-programmatically