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

Question

我正在尝试从触发<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>并通过其他方式触发其点击事件。

Answer 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');
        });
      }
    };
});