Angular 角材料提交按钮不工作

我正在使用angular材质创建一个登录表单，但是submit按钮不起作用，控制台中也没有任何错误。 起初我试图通过它发布一个http请求，但它不起作用，所以我只使用了一个简单的日志来测试，但它仍然不起作用

login.html：

        <form class="my-form" #loginForm=ngForm (ngSubmit)="Submit()">
          <mat-form-field class="full-width">
            <mat-label>Email</mat-label>
            <input matInput class="form-control"
             [formControl]="emailControl"
             placeholder="Enter Your Nickname" type="email">

            <mat-error *ngIf="emailControl.hasError('email')">

              Please enter a valid email address
            </mat-error>
            <mat-error *ngIf="emailControl.hasError('required')">
              Email is <strong>required</strong>
            </mat-error>
          </mat-form-field>

          <mat-form-field class="full-width">
            <mat-label>Password</mat-label>
            <input [formControl]="passwordControl"
             matInput name="password"
             type="password" 
             class="form-control"
              placeholder="Enter Your  Password">
            <mat-error *ngIf="passwordControl.hasError('required')">
              Password is <strong>required</strong>
            </mat-error>
            <mat-error *ngIf="passwordControl.hasError('minLength')">
              Password should be more then 7 characters
            </mat-error>
          </mat-form-field>
        </form>
      </mat-card-content>
      <mat-card-actions>
        <button mat-raised-button type="submit" color="primary">LOGIN</button>
      </mat-card-actions>
    </mat-card>
    </div>

---

您在提交方法调用时错过了

（）

，提交按钮位于

表单的外部。将其放入
表单中。应该是这样的

TS

(ngSubmit)="Submit()"

HTML

  <form class="my-form" #loginForm=ngForm (ngSubmit)="Submit()">
    ...
     <mat-card-actions>
            <button mat-raised-button type="submit" color="primary">LOGIN</button>
     </mat-card-actions>
    ...
    </form>


...
登录
...
您的提交按钮不是表单的一部分

应该是

<form class="my-form" #loginForm=ngForm (ngSubmit)="Submit()">
          <mat-form-field class="full-width">
            <mat-label>Email</mat-label>
            <input matInput class="form-control"
             [formControl]="emailControl"
             placeholder="Enter Your Nickname" type="email">

            <mat-error *ngIf="emailControl.hasError('email')">

              Please enter a valid email address
            </mat-error>
            <mat-error *ngIf="emailControl.hasError('required')">
              Email is <strong>required</strong>
            </mat-error>
          </mat-form-field>

          <mat-form-field class="full-width">
            <mat-label>Password</mat-label>
            <input [formControl]="passwordControl"
             matInput name="password"
             type="password" 
             class="form-control"
              placeholder="Enter Your  Password">
            <mat-error *ngIf="passwordControl.hasError('required')">
              Password is <strong>required</strong>
            </mat-error>
            <mat-error *ngIf="passwordControl.hasError('minLength')">
              Password should be more then 7 characters
            </mat-error>
          </mat-form-field>
      </mat-card-content>
      <mat-card-actions>
        <button mat-raised-button type="submit" color="primary">LOGIN</button>
      </mat-card-actions>
    </mat-card>
</form>


电子邮件
请输入有效的电子邮件地址
电子邮件是必需的
密码
密码是必需的
密码应超过7个字符
登录
删除您的验证器，尝试不使用验证器。您现在可以检查它吗？是的，它正在工作！。问题是它在形式之外。非常感谢。
<form class="my-form" #loginForm=ngForm (ngSubmit)="Submit()">
          <mat-form-field class="full-width">
            <mat-label>Email</mat-label>
            <input matInput class="form-control"
             [formControl]="emailControl"
             placeholder="Enter Your Nickname" type="email">

            <mat-error *ngIf="emailControl.hasError('email')">

              Please enter a valid email address
            </mat-error>
            <mat-error *ngIf="emailControl.hasError('required')">
              Email is <strong>required</strong>
            </mat-error>
          </mat-form-field>

          <mat-form-field class="full-width">
            <mat-label>Password</mat-label>
            <input [formControl]="passwordControl"
             matInput name="password"
             type="password" 
             class="form-control"
              placeholder="Enter Your  Password">
            <mat-error *ngIf="passwordControl.hasError('required')">
              Password is <strong>required</strong>
            </mat-error>
            <mat-error *ngIf="passwordControl.hasError('minLength')">
              Password should be more then 7 characters
            </mat-error>
          </mat-form-field>
      </mat-card-content>
      <mat-card-actions>
        <button mat-raised-button type="submit" color="primary">LOGIN</button>
      </mat-card-actions>
    </mat-card>
</form>