How to load the ng-template in separate file?

Question

In below sample, I have used ng-template like below and it is working fine.

Sample link: click here

Answer 1

i got an answer for this question from github angular please check this https://github.com/angular/angular/issues/27503

Answer:

step1:

i have initialized my template as a new component as like below

template.component.ts

import { Component, Input } from '@angular/core';

@Component({
  selector: 'app-device',
  template: `
  
  {{dataSource.header}} {{dataSource.text}}
  
    Sign In
  
`
})
export class DeviceComponent {
  @Input()
  dataSource: any;
}

Then i have used that component template in my parent component as like below

default.html

sample link sample click me