How to use Typescript variables in angular2 inline template?

Hello, welcome to therichpost.com. In this post, I will tell you How to use Typescript variables in angular2 inline template? Nowadays Angularjs is very popular and known as one page website. I am familiar with Angular1 very well but Angular2 is totally different with Angular1. Angular2 is totally command based. The very new feature in it is Typescript. That I litle discussed in my last post that declares variables in TypeScript. I will tell more about Typescript in my future posts.

• //Define varibales:
  

  name:string = “testcode”;

• //Use varibales:
  

  {{name}}

Finally here is the working angular2 component and you can see I have made some TypeScript and that TypeScript variables how I used in inline template:

import { Component, OnInit } from ‘@angular/core’;
@Component({
selector: ‘app-contact-us’,
template: `
//use varibales
Contact Us Page Coming Soon….{{name}}{{myHero}}
`,
styleUrls: [‘./contact-us.component.css’]
})
export class ContactUsComponent implements OnInit {
//Define varibales
name:string = “testcode”;
heroes: any[];
myHero:string;
constructor() {
//Assign values to varibales
this.heroes=[‘Windstorm’,’Bombasto’,’Magneta’,’Tornado’]
this.myHero = this.heroes[0];
}
ngOnInit() {
}
}

There are many more in Angular2 and i will let you know all. Please do comment if you any query related to this post. Thank you. Therichpost.com