一尘不染

如何使用angularjs在ng-click中触发另一个元素的click事件?

angularjs

我正在尝试从触发<input type="file">元素的click事件button

<input id="upload"
    type="file"
    ng-file-select="onFileSelect($files)"
    style="display: none;">

<button type="button"
    ng-click="angular.element('#upload').trigger('click');">Upload</button>

通常的做法是隐藏被称为丑化的野兽,<input type=file>并通过其他方式触发其点击事件。


阅读 514

收藏
2020-07-04

共1个答案

一尘不染

如果您的输入和按钮是同级(在您的情况下是OP):

<input id="upload"
    type="file"
    ng-file-select="onFileSelect($files)"
    style="display: none;">

<button type="button" uploadfile>Upload</button>

使用指令将按钮的单击绑定到文件输入,如下所示:

app.directive('uploadfile', function () {
    return {
      restrict: 'A',
      link: function(scope, element) {

        element.bind('click', function(e) {
            angular.element(e.target).siblings('#upload').trigger('click');
        });
      }
    };
});
2020-07-04