Validaciones custom con Angular 5

app.component.html

<form [formGroup]="agendaForm" (ngSubmit)="submit()">
  <input formControlName="usuario">
  <input formControlName="telefono">

  <div *ngIf="agendaForm.get('usuario').errors">
     <div *ngIf="agendaForm.get('usuario').errors['required']">
          Nombre de usuario es requerido
     </div>
  </div>

  <div *ngIf="!agendaForm.valid">
       Hay errores en el form!!!
  </div>

  <button type="submit" [disabled]="!agendaForm.valid">Enviar</button>
</form>

app.component.ts

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

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'app';

  agendaForm: FormGroup;

  constructor(private fb: FormBuilder) {
    this.crearForm();
  }

  crearForm() {
    this.agendaForm = this.fb.group({
      usuario: ['texto precargado', Validators.required],
      telefono: ['', Validators.compose(
                        [Validators.required,
                         this.telefonoValidator(/^[679]{1}[0-9]{8}$/)
                        ]
                      )
                ]             
    });
  }

  telefonoValidator(telefonoExp: RegExp): ValidatorFn {
    return (control: AbstractControl): {[key: string]: any} => {
      const telefono = telefonoExp.test(control.value);
      return !telefono ? {'telefonoNumber': {value: control.value}} : null;
    };
  }
}

app.module.ts

import { BrowserModule } from '@angular/platform-browser';

import { NgModule } from '@angular/core';

import { ReactiveFormsModule } from '@angular/forms';

import { AppComponent } from './app.component';

@NgModule({

  declarations: [

    AppComponent    

  ],

  imports: [

    BrowserModule,

    ReactiveFormsModule

  ],

  providers: [],

  bootstrap: [AppComponent]

})

export class AppModule { }