Property 'X' is private and only accessible within class 'xyzComponent'

Maybe another even simpler answer is:

Guys, please don't call private methods, fields or properties from the HTML :)


P.S. when compiling the *.ts code to *.js, AOT refuse to connect non-public members with the HTML template.

And "yes" this will make your build pipeline to fail :D


For a given component all its members (methods, properties) accessed by its template must be public in the AOT compilation scenario. This is due to the fact that a template is turned into a TS class. A generated class and a component are 2 separate classes now and you can't access private members cross-class.

In short: you can't access private members in your templates if you want to use ahead-of-time compilation.

For better explaination https://github.com/angular/angular/issues/11422