* ngIf does not work when used inside a template tag

Question

* ngIf does not work when used inside a template tag

We use * ngIf inside the Angular 2 template tag, after which if we fire the click event from inside the template control, the HTML inside the template is deleted or changed.

This is the repeater control that I use,

@Component({
selector: "repeater",
template:

`
    <div *ngIf='children'>
        <div *ngFor='let current of source'>
            <template [ngTemplateOutlet]="children._results[0]" OutletContext]="{ item: current }">
            </template>
         </div>
    </div>`
})

export class Repeater {
    @ContentChildren(TemplateRef)
    children: QueryList<TemplateRef<any>>

    @Input()
    source: Array<any>;
}

Here is my component application code

@Component({
  selector: 'my-app',
  template: `<repeater [source]="dllApprovalStatus">
          <template let-data="item">
         {{data.name}}
              <p *ngIf='data.name==1' (click)='myclick(data.name)'> Array value {{data.name}}</p>
          </template>
        <repeater>`,
})
export class App {
  name:string;
   dllApprovalStatus: any = [{ name: 1 }, { name: 1 }, { name: 0 }];
   constructor() {
    this.name = 'Angular2'
  }

   myclick(data: any) {

   alert(data);
  }
}