小编Kar*_*hik的帖子

我如何防止页面重新加载表单提交角度 7

我不熟悉 Angular。我面临提交按钮的问题。当我点击提交类型的按钮时,它正在重新加载完整的页面。而不是调用我的服务 API。

即使我在表单标签和按钮单击方法中添加了 (keydown.enter)="$event.preventDefault()" ,我也尝试使用 event.preventDefault() 。但没有奏效。

请检查我下面的代码

<form  #createForm="ngForm" class="login-form text-center" (ngSubmit)="Update()" (keydown.enter)="$event.preventDefault()">
       <table cellpadding="5" class="mx-auto">
          <tr>
            <td>
              <label class="white pr-2" for="email" autofocus>Email</label>
            </td>
            <td>
              <input name="email" id="email" type="text" [(ngModel)]="email" required  #name="ngModel"class="d-inline-block w-100" >
            </td>
          </tr>

          <tr>
            <td></td>
            <td class="text-left">

                <button class="d-inline-block text-left lh-100" id="login" type="submit"  [disabled]="!createForm.form.valid">Change Password
                 </button>&nbsp;
                 <button class="float-right lh-100" style="background-color:grey" [routerLink]="'/login'" >Back to Login</button>

             </td>
          </tr>
        </table>
      </form>
Run Code Online (Sandbox Code Playgroud)

这是我的 .ts 代码。按钮更新方法

Update()
  {

   this.userservice.changePassword(this.email).pipe(first())
    .subscribe(
        data => 
        {
            if(!data.message)
            {
              this.errorMsg = data.message;
            }
           else …
Run Code Online (Sandbox Code Playgroud)

submit button reload angular7

6
推荐指数
2
解决办法
9581
查看次数

标签 统计

angular7 ×1

button ×1

reload ×1

submit ×1