Dynamically inject ionic components

 sample: any = `<ion-row>
  <ion-col col-6>
    <span>Akash Pal</span>
  </ion-col>
  <ion-col col-6 text-right>
    2019-4-15
  </ion-col>
</ion-row>

<ion-row>
  <ion-col class="underline" col-6>
    Name of the Employee/Participant
  </ion-col>
  <ion-col col-1></ion-col>
  <ion-col class="underline" col-5 text-right>
    Date
  </ion-col>
</ion-row>

<ion-row padding-vertical>
  <ion-col col-2>
    <ion-checkbox [(ngModel)]="submit"></ion-checkbox>
  </ion-col>
  <ion-col col-10>I agree to all</ion-col>
</ion-row>

<div *ngIf="submit" class="button-center">
  <button ion-button color="light" round (click)="completeOnboarding()">Finish Onboarding</button>
</div>`;

Template

<p [innerHTML]="sample | sanitizeHtml"></p>

The ionic components are not rendered, is there any solution to it?