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

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


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


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


I got this when I declared private injectables in the constructor:

constructor(private service: SpecificObjectService) { }

And used them in the template:

*ngFor="let pd of service.listSpecificObject "

The solution is:

constructor(public service: SpecificObjectService) { }