绑定到动态生成的 HTML 的事件被自动调用答案

【问题标题】：Event binded to dynamically generated HTML get called automatically绑定到动态生成的 HTML 的事件被自动调用
【发布时间】：2017-01-30 20:00:52
【问题描述】：

我正在尝试将事件绑定到 AngularJs 控制器中动态生成的 html，但我不能。我发现以下代码 sn-p

var div = angular.element("del-" + input.name);
div.bind('onclick', $scope.DeleteImage());

但它会立即调用DeleteImage() 函数。我想添加具有功能的 deleteImage 图标，以从 ImageuploadList 中删除图像。任何想法，如何做到这一点？这是我的代码：

 function readImageURL(input) {
            if (input) {
                var reader = new FileReader();
                reader.onload = function (e) {
                    $('#pageImageList').append('<span class="upload-image recent-images"> <a id="del-' + input.name + '" href="javascript:void(0);" class="glyphicon glyphicon-trash" ></a><img src="' + e.target.result + '" id="' + input.name + '" width="100%" height="100%"></span>')
                    var div = angular.element("del-" + input.name);
                    div.bind('onclick', $scope.DeleteImage());

                    $scope.imageUpload.push({
                        ImageUrl: e.target.result,
                        ImageName: input.name
                    });
                };
                reader.readAsDataURL(input);
            }
        }

【问题讨论】：

标签： jquery angularjs file-upload angularjs-scope

【解决方案1】：

看代码“div.bind('onclick', $scope.DeleteImage());”，其实是在调用函数。

请检查是否要在单引号中添加“$scope.DeleteImage()”

【讨论】：

【解决方案2】：

这段代码：

div.bind('onclick', $scope.DeleteImage());

将onclick 绑定到调用DeleteImage 的结果。您需要传入一个函数指针，而不是调用函数（ () 所做的），即：

div.bind('onclick', $scope.DeleteImage);

或使用内联函数：

div.bind('onclick', function() { $scope.DeleteImage(); });

【讨论】：

它运行良好，但需要少量修改，如下所示： div.bind('click', function() { $scope.DeleteImage(); });而不是“点击”，只需“点击”。
不知道（您的？）angularjs 控制器中有什么可用的，我保留了您绑定到的事件名称。很高兴你把它整理好了。