input license here

How to hidden and show en element in Angular

Thủ thuật lập trình Angular xin chào các bạn, hôm nay mình sẽ giới thiệu cho các bạn về một vấn đề thường gặp trong lập trình angular, nếu ai đó thường sử điều kiện để thực hiện các dòng lệnh trong lập trình thì các bạn hãy đọc bài viết này để tham khảo, có thể sau này bạn gặp thì có thể vấn đề hidden and show en element này bạn dễ dàng xử lý một cách nhanh nhất sẽ không mất thời gian, nên vì thế các bạn đừng nên bỏ lỡ bài viết này.
How to hidden and show en element in Angular

Để sử dụng hidden and show div in angular bạn phải thực hiện một điều kiện gồm 2 trường hợp là hidden or visible vì thế để xác định yêu cầu của khách hàng bạn mới thực hiện nó.

Thực hiện điều kiện trong file app.component.ts

import { Component } from '@angular/core';
@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent {
  name = 'Angular';
  tienanhvn: boolean = true;
}

Trong đó :
tienanhvn là một kiểu dữ liệu boolean nếu nó chỉ nhận 2 giá trị true hoăc false.

File app.component.html

<p>Show </p>
<h1  [style.visibility]="(tienanhvn === false) ? 'hidden' : 'visible' ">Tienanhvn.blogspot.com</h1>
<p>Hidden </p>
<h1  [style.visibility]="(tienanhvn === true) ? 'hidden' : 'visible' ">Tienanhvn.blogspot.com</h1>

Nếu tienanhvn  === false thì nó sẽ visible en element còn nếu tienanhvn === true thì nó sẽ hidden en element như kết quả trên.
Related Posts
Diệp Quân
Nguyen Manh Cuong is the author and founder of the vmwareplayerfree blog. With over 14 years of experience in Online Marketing, he now runs a number of successful websites, and occasionally shares his experience & knowledge on this blog.
SHARE

Related Posts

Subscribe to get free updates

Post a Comment

Sticky