angular.element触发点击事件不起作用

Question

angular.element触发点击事件不起作用

3

我一直在尝试使用另一个元素中的angular ng-click触发我的输入元素中的click事件，就像这样：

html

<div class="myClass" ng-click="vm.selectImage()" nv-file-drop uploader="vm.uploadImage">
    Drop your image here
</div>
<div ng-hide="!hideInput">
    <input type="file" id="imgSelect" nv-file-selec uploader="vm.uploadImage" />
</div>

控制器

vm.selectImage= selectImage;
function selectImage() {
    angular.element('#imgSelect').trigger('click');
};

我知道这里还有其他类似的问题，但我已经尝试使用他们提供的方法（其中一堆显示了我正在使用的相同代码），例如：

但即使使用这些方法，或者使用像这样的指令：

.directive('selectImg', selectImg);
function selectImg() {
    return {
        restrict: 'A',
        link: function(scope, element) {
            element.bind('click', function(e) {
                //option 1
                angular.element(e.target).siblings('.imgSelect').trigger('click');

                //option 2
                angular.element( document.querySelector( '#imgSelect' ) ).trigger('click');

                //option 3
                var myEl = angular.element( document.querySelector( '#imgSelect' ) );
                myEl.trigger('click');

                //option 4
                angular.element('#imgSelect').trigger('click'); //angular way
            });
        }
    };
};

我不断收到这个错误：

错误：[jqLite:nosel] http://errors.angularjs.org/1.5.0-beta.1/jqLite/nosel

这是一个演示此错误的 Plunker：http://plnkr.co/edit/rWcCbixwFArYhCxUVTsv?p=preview 问题出在哪里？

- celsomtrindade

请创建一个Plunkr来演示问题。 - Ganesh Kumar

@GaneshKumar 我已经用一个 plunker 更新了我的问题。 - celsomtrindade

问题在于你没有按照 Angular 的方式进行操作，所以毫不奇怪它无法正常工作。所有你的版本都不可靠，因为它们试图处理不在指令上下文中的 DOM，所以当你尝试使用它时，模板很可能还没有加载到 DOM 中。 - dfsq

angular.element()方法没有trigger()方法。https://docs.angularjs.org/api/ng/function/angular.element - Ganesh Kumar

删除选择器或添加jQuery，jQuey Lite不支持选择器。 - Mat.

那为什么其他答案说要这样做，并且被接受呢？或者，我应该如何只使用AngularJs来实现它？我没有计划在我的项目中插入jQuery。 - celsomtrindade

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Mat. · Accepted Answer

好的，我更新了我的回答，这个方法是有效的。看起来你需要跳出当前的 $apply() 循环。一种方法是使用 $timeout()。

setTimeout(function() {
    document.getElementById('imgSelect').click()        
 }, 0);

检查答案如何在AngularJS中触发输入文件的点击事件