ng-template, ng-content, ViewContentRef

1. https://www.concretepage.com/angular-2/angular-4-ng-template-example  (VVI for ng-template)
2.  https://netbasal.com/angular-2-understanding-viewcontainerref-acc183f3b682 (VVI viewContentRef , https://angular.io/api/core/ViewContainerRef )
3. https://stackoverflow.com/questions/42420957/angular-setting-context-with-createembeddedview  (how to pass data from createEmbedded view from ts file)

viewContainerRef Represents the ng-container.

So as a rule of thumb you can go for the following:

• { static: true } needs to be set when you want to access the ViewChild in ngOnInit.
• { static: false } can only be accessed in ngAfterViewInit. This is also what you want to go for when you have a structural directive (i.e. *ngIf) on your element in your template.

In most cases you will want to use {static: false}. Setting it like this will ensure query matches that are dependent on binding resolution (like structural directives *ngIf, etc...) will be found.

Example of when to use static: false:

@Component({
  template: `
    <div *ngIf="showMe" #viewMe>Am I here?</div>
    <button (click)="showMe = !showMe"></button>
  ` 
})
export class ExampleComponent {
  @ViewChild('viewMe', { static: false })
  viewMe?: ElementRef<HTMLElement>; 

  showMe = false;
}

The static: false is going to be the default fallback behaviour in Angular 9. Read more here and here

The { static: true } option was introduced to support creating embedded views on the fly. When you are creating a view dynamically and want to acces the TemplateRef, you won't be able to do so in ngAfterViewInit as it will cause a ExpressionHasChangedAfterChecked error. Setting the static flag to true will create your view in ngOnInit.