Как загрузить внешний HTML в компоненте Material Design

Question

Я хочу сделать регистрационную форму пользователя, но я хочу разделить ее на 3 вкладки: первая вкладка для имени пользователя, пароля, телефона и фотографии профиля, вторая вкладка для адреса, страны и города и третья вкладка для другие данные. Я использую угловой компонент дизайна материала, такой как mat-tab-group, и хочу создать независимую форму для каждой вкладки и сообщить компоненту mat-tab-group, который загружает внешний HTML-шаблон, что-то вроде этого:

<mat-tab-group animationDuration="2000ms">
    <mat-tab label="First">
      <ng-template matTabContent>
          <div>
            load my first template here
          </div>
      </ng-template>
    </mat-tab>
    <mat-tab label="Second">
      <ng-template matTabContent>
        Load my second one
      </ng-template>
    </mat-tab>
    <mat-tab label="Third">
      <ng-template matTabContent>
        Load the thirth template
      </ng-template>
    </mat-tab>
  </mat-tab-group>

Кто-нибудь знает, как я могу это сделать в ANgular 7?