$(".class").click(); 是否有任何等价物？在打字稿中？

Question

我在角度使用日期范围选择器。

<button type="button" class="btn btn-danger daterange-ranges">
<i class="icon-calendar22 position-left"></i> <span></span> 
<b class="caret"></b>
</button>

当我点击它时，我会在下拉菜单中选择日期范围，其中包含一个“applyBtn”类的应用按钮。

在 JQuery 中有一个选项 $(".class").click(); 来获取 onclick 函数。 我不能写(click)="getdateRange()"。打字稿中$(".class").click(); 是否有任何等价物？

我想要类似的东西，

$(".applyBtn").click(function(){ alert("The button was clicked."); });

Answer 1

你可以使用纯 javascript 来做到这一点

    document.querySelector('.applyBtn').addEventListener('click', () => {
       alert("The button was clicked.");
    });

它将与 JQuery 中的 $(".applyBtn").click(); 做同样的事情

Answer 2

正如我在标签中看到的，您使用的是 Angular。在 Angular 中使用 jQuery 并不是一个好主意，因为它有自己很棒的工具。

要制作点击处理程序，您需要执行以下操作

<anyTag (click)="clickHandler($event)"></anyTag>

然后在你的组件中粘贴下一个：

public clickHandler(event) {
  //do whatever you want
}

如果你想知道$event 传递了什么，欢迎使用 angular.io API

附：如果你想重复使用它，你需要把它变成一个额外的组件，比如date-picker.component.ts，然后粘贴到那里。然后您可以通过[date]="date" 将表单的值传递给创建的组件并在组件@Input() date; 中检索它。

您还可以通过

向父级发送值

@Output() emitter = new EventEmitter();

public emitValue(): void {
  this.emitter.emit(value);
}

并在父组件中获取发射值 <app-picker (emitter)="handleEmit($event)></app-picker>

父组件.ts

public handleEmit(event) {
  //do something
}