在Angular中，我们可以使用模板驱动表单或响应式表单来处理表单验证。无论使用哪种类型的表单，都可以通过以下步骤在表单无效时显示错误消息：

1. 在组件中定义表单控件和验证规则：

import { Component } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';

@Component({
  selector: 'app-my-form',
  templateUrl: './my-form.component.html',
  styleUrls: ['./my-form.component.css']
})
export class MyFormComponent {
  myForm: FormGroup;

  constructor(private formBuilder: FormBuilder) {
    this.myForm = this.formBuilder.group({
      name: ['', Validators.required],
      email: ['', [Validators.required, Validators.email]]
    });
  }

  get formControls() {
    return this.myForm.controls;
  }

  onSubmit() {
    if (this.myForm.invalid) {
      return;
    }

    // 处理表单提交逻辑
  }
}

2. 在模板中显示错误消息：

  

    Name:
    
    

      
Name is required.
    
  
  

    Email:
    
    

      
Email is required.
      
Invalid email format.
    
  
  Submit

在上面的示例中，我们使用FormGroup和FormControl来定义表单控件，并使用Validators来定义验证规则。在模板中，我们使用formGroup指令将表单绑定到组件中的myForm属性，使用formControlName指令将表单控件绑定到相应的表单字段。

我们使用*ngIf指令来根据表单控件的状态和错误显示错误消息。formControls.name.errors和formControls.email.errors分别表示name和email字段的验证错误对象。formControls.name.dirty和formControls.email.dirty表示字段是否已被修改过，formControls.name.touched和formControls.email.touched表示字段是否已被触摸过。

在onSubmit()方法中，我们检查表单是否无效。如果表单无效，我们可以阻止提交逻辑，并且错误消息将显示在相应的字段下方。

注意：以上示例仅适用于模板驱动表单。如果使用响应式表单，则需要相应地更改模板和组件中的代码。