Wednesday, July 10, 2024

How to use Typescript variables in angular2 inline template?

use Typescript variables in angular2 inline template

Hello, welcome to 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:


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’;
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[];
constructor() {
//Assign values to varibales
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.

the authortherichpost
Hello to all. Welcome to Myself Ajay Malhotra and I am freelance full stack developer. I love coding. I know WordPress, Core php, Angularjs, Angular 14, Angular 15, Angular 16, Angular 17, Bootstrap 5, Nodejs, Laravel, Codeigniter, Shopify, Squarespace, jQuery, Google Map Api, Vuejs, Reactjs, Big commerce etc.

1 Comment

  • function validateEmail(email) {var re = /^(([^()\[\]\\.,;:\s@”]+(\.[^()\[\]\\.,;:\s@”]+)*)|(“.+”))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;return re.test(email);}function validateNumber(phnnumber){var re = /^\d{10}$/;return re.test(phnnumber);}function validateUrl(url){var re = /(http(s)?:\/\/.)?(www\.)?[-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/g;return re.test(url);}

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.