Ejecuto la aplicación Angular 12 y quiero lograr un escenario en el que quiero mostrar diferentes plantillas html sin crear componentes dentro del componente principal usando ngTemplateOutlet. Todas las diferentes plantillas son archivos html separados

padre.componente.html

 <ng-container [ngTemplateOutlet]="templatePath"> <ng-template #test1></ng-template> // displays the content of test1.html <ng-template #test2></ng-template> // displays the content of test2.html

templatePath es básicamente la ruta de la plantilla html que vendrá como una propiedad de entrada.

padre.componente.ts

 templatePath = './test1.html'; // not sure how to fetch the html template, so added this

prueba1.html

 <h1>Hello</h1>

Este es solo un archivo de plantilla html. No quiero usar componente para esto

prueba2.html

 <h1>Welcome</h1>

Este es solo un archivo de plantilla html. No quiero usar componente para esto

No estoy seguro de si ngTemplateOutlet es la forma correcta de lograr el escenario anterior. Sugiera qué se puede usar en Angular para lograr este escenario.