Saturday, July 20, 2024

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.

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.

Leave a Reply

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