请原谅这里的任何关键术语错误。尽管我的英语很好,但我还是用我的母语学习了编程。
我有一个使用 Bootstrap 运行最新版本 Angular 的项目。我不知道这是否在这里有所作为,我真的很难过。
我的组件中有两个单独的模态。其中之一包括一个将一些数据注册到我的数据库的表单,并有一个按钮,该按钮绑定(bind)了一个函数以保存所有数据。它看起来像这样:

<div class="modal fade" id="addTaskModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
  aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Submit a new task</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <form [formGroup]="taskForm" class="form-group">
           <!-- Form data and whatnot is in here -->
        </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <input type="button" value="Submit Task" class="btn btn-primary" (onclick)="submitTask()">
           <!-- ^^ This button is not running correctly -->
      </div>
    </div>
  </div>
</div>
我的 typescript 看起来像这样
  submitTask() {
    console.log("test");
  }
它甚至不会登录到控制台。通常当我调用一个没有在我的 typescript 组件中声明的函数时,页面不会呈现并返回一个错误,这很好。我尝试将函数的名称更改为不存在的名称,但由于某种原因我没有收到错误消息。我的 VS Code 控制台出现错误,但页面仍然呈现并运行良好。我做错了什么很明显吗?或者只是我不能在一页上有两个模态,尽管这根本没有意义?

最佳答案

您不要在 Angular 组件中使用 on 前缀。
所以它看起来像这样(简化):

<button class="btn btn-primary" (click)="submitTask()">Submit Task</button>
事件绑定(bind)文档:https://angular.io/guide/event-binding

关于javascript - 为什么这个功能没有运行?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/63128290/

10-12 00:20
查看更多