Component class properties in Angular template

All public properties of the component class will be available inside the component template. Let's see how to access them.

Let our class have the following public property:

app/app.component.tsexport class AppComponent {
  public test: string = 'abcde';
}

Let's display the contents of our property in the layout. To do this, you need to write the name of the property inside double curly brackets:

app/app.component.html<div>
  {{ test }}
</div>

app/app.component.html<ul>
  <li>name: john</li>
  <li>surn: smit</li>
</ul>