Monday, January 17, 2022

Show Hide text in Angular2

Show Hide text in Angular2

Hello, welcome to In this post, I will tell you How to Show Hide text in Angular2? Nowadays Angularjs is very popular and known as one page website. I am familiar with Angular 1 very well but Angular 2 is totally different with Angular 1. Angular2 is totally command based.

Here is the HTML code and you need to add this app.component.html file:

<button (click)=”test()”>Show Text</button>
<button (click)=”test2()”>Hide Text</button>
<p *ngIf=”test_div”>
test button clickek!!

Here is the typescript code and you need to add this app.component.ts file:

// Initialize variable false(boolean) in angular 2
test_div = false;

//Text Show Function
this.test_div = true;
//Text Hide Function
this.test_div = false;

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

Ajay Malhotra
the authorAjay Malhotra
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 2, Angular 6, Angular 7, Angular 8, Angular 9, Angular 10, Angular 11, Angular12, Angular 13, Bootstrap 5, Nodejs, Laravel, Codeigniter, Shopify, Squarespace, jQuery, Google Map Api, Vuejs, Reactjs, Big commerce etc.

Leave a Reply

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