Is it okay to mark a @ViewChild as private?

Question

Is it okay to mark a ViewChild as private, if it's not being referenced in the template?

I have been able to do this, then build and serve with the '--prod' flag, and encountered no errors. I'm currently using Angular 7.

@ViewChild(HelloComponent) private helloComponent;

Here's a stackblitz to what I'm talking about:
https://stackblitz.com/edit/angular-vxbpuk?file=src%2Fapp%2Fapp.component.ts

I think I have the stackblitz using aot, but you could verify the same thing locally.

EDIT: I apologize for not bringing this up before, but there's this blurb from the angular doc that give me pause:

https://angular.io/guide/aot-compiler#phase-2-code-generation

Decorated component class members must be public. You cannot make an @Input() property private or internal.

But as @GCSDC already pointed out below, the Angular team seems to be using private members in their examples:
https://angular.io/guide/component-interaction#parent-calls-an-viewchild

Answer 1

It seems that yes, this is ok, as you may find it done also on the official angular fundamentals guides, at:

Components & Templates > Component Interaction > Parent calls an @ViewChild():

@ViewChild(CountdownTimerComponent) private timerComponent: CountdownTimerComponent;

Answer 2

The private and public syntax is an enhancement for the javascript language for "static analyze" in typescript transpiler, I would recommend you to try the playground how typescript transpiles to JS. So basically it's a way for anyone reading the code get a sense of what the scope is for the variables/functions. Example of a simple variable inside a class would be that they both transpiles into the same JS private var1: number = 0 and public var1: number = 0 transpiles both to this.var1 = 0

However! There could be situations you would actually like to access @ViewChild from a parent component, but in that situation you have to put it as @ViewChild(HelloComponent) public helloComponent; or you will get "compile/transpile" error. If you want to give a more clearer feeling on where the scope would be keep it as private and instead use getters/setters like so:

export class MyComponent {

  @ViewChild(HelloComponent) private _helloComponent;

  get helloComponent(): any {
    return _helloComponent;
  }

  set helloComponent(set: any) {
    this._helloComponent = set;
  }

}