Как запускать ngClick программно

Я хочу вызвать ng-click элемента во время выполнения, например:

_ele.click();

ИЛИ

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

Как это можно сделать?

Ответ 1

Синтаксис следующий:

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 Расширить способ здесь.

Если вы используете старые версии angular, вы должны использовать триггер вместо triggerHandler.

Если вам нужно применить распространение остановки, вы можете использовать этот метод следующим образом:

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

Ответ 2

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

EDIT: Похоже, вам нужно вырваться из текущего цикла $apply(). Один из способов сделать это - использовать $timeout():

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

Смотрите скрипту: http://jsfiddle.net/t34z7/

Ответ 3

Это следующее решение работает для меня:

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

вместо:

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

Ответ 4

На всякий случай, когда все это видят, я добавил дополнительный дублирующий ответ с важной строкой, которая не нарушит распространение событий

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

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

Ответ 5

Использование обычного старого JavaScript работало для меня:
document.querySelector('#elementName').click();

Ответ 6

Вы можете сделать как

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

Ответ 7

Лучшее решение - использовать:

domElement.click()

Поскольку в иерархии DOM не отображаются пузырьки событий triggerularss triggerHandler (angular.element(domElement).triggerHandler('click')), но один из них делает это - как обычный щелчок мыши.

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

Ответ 8

Я думаю, было бы лучше избегать "нажатия" на элементы. Вместо этого следует попытаться изменить базовые данные (ng-model), которые (почти всегда) просматриваются элементом.

Пример с флажком:

var app = angular.module('myApp', []);
app.controller('myController', function($scope) {
  $scope.toggle = function() {
    $scope.myCheckboxValue = !$scope.myCheckboxValue;
  };
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app='myApp' ng-controller='myController'>
  <input type="checkbox" ng-model="myCheckboxValue" />
  <button ng-click="toggle()">Toggle</button>
</div>

Ответ 9

Этот код не будет работать (выдает ошибку при нажатии):

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

Вам нужно использовать querySelector следующим образом:

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

Ответ 10

Включите следующую строку в ваш метод там, где вы хотите вызвать событие клика

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