Angular 2 Change text of HTML element Angular 2 Change text of HTML element typescript typescript

Angular 2 Change text of HTML element


Use interpolation using the double curly braces {{ }} and bind your FirstName and LastName. Read more about template syntax.

Change your html to following:

<div class="col col-sm-12">  <h2>{{ FirstName }} {{ LastName }}</h2></div>

... and in your profile.component.ts:

FirstName: string = '';LastName: string = '';changeName():void{    this.FirstName = 'New First Name';    this.LastName = 'New Last Name';}


Step 1:-At html file (profile.component.html)

<div class="col col-sm-12">  <h2 *ngIf="data==null; else elseBlock" >FirstName LastName</h2><ng-template #elseBlock><h2  [innerHTML] = "data"></h2></ng-template></div>

Step 2: At ts file (profile.component.ts)

public data:any;changeName():void{       this.data="Your Data";    }