提交按鈕未觸發模式

Question

提交按鈕應觸發“檢查”功能，並觸發引導程序模式。 但是后來沒有發生。 當我將html更改為type =“ button”時，它可以工作。 是否有可能使用提交按鈕來觸發引導程序模式？

<form [formGroup]="guessForm" (ngSubmit)="check($event)" class="form-group">
    <input type="number" formControlName="answer" class="form-control">
    <button type="submit" [disabled]="!guessForm.valid" data-toggle="modal" [attr.data-target]="myModal" class="btn btn-success">Check</button>
</form>

Answer 1

發生這種情況是因為默認情況下， submit按鈕會刷新頁面。 嘗試通過以下代碼行阻止它。
$event.preventDefault();
在檢查方法中將其添加為第一行。 那應該可以了。

Answer 2

首先，您需要創建一個事件，而不是控制提交按鈕和觸發模式，如下所示。 我用jquery稱呼它，但是您使用了所需的框架。

<input type="submit" value="submit" onclick = "foo();"/>
<script>
    function foo(){
      $('#yourModalId').modal('show'); 
    }
</script>

對於有角JS，您可以點擊以下鏈接： http : //plnkr.co/edit/wfv8P2T1ENg6XkjruzEq?p=preview