Question

请原谅任何关键术语错误。即使我的英语很好，我还是用母语学习编程的。

我有一个使用Bootstrap运行最新版本Angular的项目。我不知道这是否在这里有所作为，我真的很困惑。

我的组件中有两个单独的模态。其中之一包括将一些数据注册到我的数据库的表单，并具有一个绑定了功能的按钮，以便保存所有数据。看起来像这样：

<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>

我的打字稿看起来像这样

  submitTask() {
    console.log("test");
  }

它甚至都不会登录到控制台。通常，当我调用在打字稿组件中未声明的函数时，页面将不会呈现并返回错误，这很好。我尝试将函数的名称更改为不存在的名称，由于某种原因，我没有收到错误。我的VS Code控制台出现错误，但页面仍呈现并正常工作。我是在做显而易见的错误吗？还是只是我不能在一页上有两个模态，尽管那根本没有意义？

Answer 1

在Angular组件中不要使用on前缀。所以看起来像这样（简化）：

<button class="btn btn-primary" (click)="submitTask()">Submit Task</button>

事件绑定文档：https://angular.io/guide/event-binding

Answer 2

protected $rules_update = [
    'email_address' => 'required|email|unique:users,email_address,'. $this->id,
    'first_name' => "required",
    'last_name' => "required",
    'password' => "required|min:6|same:password_confirm",
    'password_confirm' => "required:min:6|same:password",
    'password_current' => "required:min:6"
];

删除{strong> onclick 之间的括号，并将其更改为 onclick ，如<input type="button" value="Submit Task" class="btn btn-primary" (onclick)="submitTask()">所示。

或者，执行<input on-click="submitTask()">

(click)="submitTask()"

请参阅Event Binding docs

为什么此功能无法运行？

2 个答案: