时间戳

首页 > 解决方案 > 我无法提交我的表格

angular - 我无法提交我的表格

问题描述

这是我的角度形式。我正在使用模板驱动的方法。当我单击 ngSubmit 时，我正在调用一个函数，但它没有被调用。我正在尝试打印一些东西，但它没有被调用。

 <div class="container">
      <div class="col-sm-6">
        <form #loginForm="ngForm" (ngSubmit)="loginUser(loginForm)">
          <div class="form-group">
            <label for="username">Username</label>
            <input type="text" class="form-control" name="username" id="username" [(ngModel)]="username" required>
          </div>
          <div class="form-group">
            <label for="password">Password</label>
            <input type="text" class="form-control" name="password" [(ngModel)]="password" id="password" required>
          </div>

          <button type="button" class="btn btn-primary">Submit</button>

        </form>
  </div>
</div>

这是我的 TS 文件。

 import { Component } from '@angular/core';
    import { NgForm } from '@angular/forms';

    @Component({
      selector: 'my-app',
      templateUrl: './app.component.html',
      styleUrls: [ './app.component.css' ]
    })
    export class AppComponent  {
      username='';
      password = '';
      loginUser(form: NgForm) {
        console.log(form.value);
    }
    }

I have added formsModule to app.module.ts. In console is shows no error.

标签： angulartypescript

解决方案

将您的按钮类型更改为submit

 <button type="submit" class="btn btn-primary">Submit</button>

推荐阅读