如何在角度5中提交表单时显示错误？

Question

我有以下表格，ts脚本和错误消息供确认：

<form [formGroup]="tripForm" (ngSubmit)="addTrip(tripForm)" novalidate> 
    <div class="form-group">    
        <label class="control-label">Trip Name</label>
        <input type="text" class="form-control" placeholder="" id="newTripName" name="newTripName" formControlName="newTripName">

        <div *ngIf="tripForm.controls['newTripName'].errors && (tripForm.controls['newTripName'].dirty || tripForm.controls['newTripName'].touched)">
            <div class="error_message" *ngIf="tripForm.controls['newTripName'].errors.required">
                    <span class="e_arrow"></span>
                    <i>Please enter Trip Name</i>
            </div>
        </div>
    </div>
</form>

ngAfterViewInit() {
    this.tripForm = new FormGroup ({
      newTripName: new FormControl('', {
        validators:  Validators.compose([
          Validators.required        
        ]),      
        updateOn: 'blur'
      })
    });   
  }

addTrip(tripForm:NgForm) {    
    if (!tripForm.valid) {        
      return;
    }
}

在模糊事件上，验证工作正常，但问题是，验证也应在提交时工作。 该方法有效，返回false，但是我不确定如何显示错误消息。 如您所见，我仅在表单字段脏或触摸时才显示消息，而提交表单时则不是这种情况。

有什么想法可以更改/添加到上面的代码中，以使其在提交时也能形成表格？

谢谢。