将当前 JQuery 对象传递给 TypeScript 箭头函数

Question

我在 Angular 组件的 ngOnInit 中编写了一个 JQuery 代码片段。这样做的目的是在模板 html.

中选择文件时触发一个方法

以下 JQuery 已写在 ngOnInit 中。注意它使用了箭头函数。

$(document.body).on("change.bs.fileinput", ".fileinput-exists", () => {
    alert("fired");
    // do file upload stuff
    // for that, access the current input field and get the uploaded file
});

为了处理文件，我需要访问它。为此，我需要在箭头函数中访问当前输入字段。

怎样才能通过呢？我尝试使用 $(this) 作为箭头函数参数。它给了我一个编译错误。

或

我应该通过这个活动吗？ (event : EventTarget) 作为箭头函数的参数。

Answer 1

"issue"是箭头函数。实际上这不是问题，而是一个功能。使用箭头函数，您不会像普通函数那样改变 this 的上下文。所以如果你想使用箭头函数，select再通过一个selector元素，因为你无法使用$(this)里面。否则（更好）您可以按照您的概述通过 jQuery 访问 event.currentTarget。但是，如果您的组件关联到同一个输入字段，您应该能够通过 $element 引用（更好）

使用 angular 访问它

这里是一个使用 event.currentTarget 的例子：

$(document.body).on("change.bs.fileinput", ".fileinput-exists", (event) => {
    alert($(event.currentTarget));
    // do file upload stuff
    // for that, access the current input field and get the uploaded file
});

将当前 JQuery 对象传递给 TypeScript 箭头函数

Passing current JQuery object to TypeScript arrow function

javascript

jquery

angularjs

arrow-functions