使用angularjs,如何触发点击,或者有更好的方法吗?

With angularjs, how can I trigger a click, or is there a better way?

我正在使用 AngularJS 创建表单向导。

像这样想每个 fieldset

<div ng-controller="MyController as fs">
  <fieldset>
      ...
      <button ng-click="fs.StepForward($event)">Next</button>
  </fieldset>

  <fieldset>
      ...
      <button ng-click="fs.StepBackward($event)">Previous</button>
      <button ng-click="fs.StepForward($event)">Next</button>
  </fieldset>
</div>

我所做的是,在我的控制器中找到当前字段集和下一个字段集,如下所示:

app.controller("MyController", function() {
  var ft = this;
  ft.StepForward = function(event) {
    // It's here that I need to find the fieldset
    ft.current_fs = event.currentTarget.parentNode;
    ft.next_fs = event.currentTarget.parentNode.nextElementSibling;
  }
});

所以首先,我不确定这是否绝对是最好的方法,但它确实有效。

回到我的主要问题...在其中一个字段集中,我有一些 li 元素,如果单击某些元素,我想自动触发对 NEXT 按钮的单击。

我尝试添加 ng-click:

<fieldset>
  <ul>
    <li><a ng-click="fs.TriggerClick($event)">Some Itme</a></li>
  </ul>
  <button id="MyButtonTest" ng-click="fs.StepForward($event)">Next</button>
</fieldset>

app.controller("MyController", function() {
  var ft = this;
  ft.StepForward = function(event) {
    // It's here that I need to find the fieldset
    ft.current_fs = event.currentTarget.parentNode;
    ft.next_fs = event.currentTarget.parentNode.nextElementSibling;
  }

  ft.TriggerClick = function(event) {
    angular.element('#MyButtonTest').trigger('click');
  }
});

但是当我创建一个触发按钮点击的函数时,我得到了错误:

Error: $rootScope:inprog Action Already In Progress

所以我想达到 jQuery,但我确信有一种 angular 方法可以做到这一点。

您必须跳出当前的 $apply() 循环。一种方法是使用 $timeout() (See why)

试试这个:

<fieldset>
  <ul>
    <li><a ng-click="triggerClick()">Some Item</a></li>
  </ul>
  <button id="MyButtonTest" ng-click="fs.StepForward($event)">Next</button>
</fieldset>

控制器

$scope.triggerClick = function(){
    $timeout(function() {
        angular.element('#MyButtonTest').triggerHandler('click');
    }, 0);
}