01/10/2018, 16:08

Xin hướng dẫn về run javascript khi đối tượng được hiển thị

Chào cả nhà, hiện mình có 1 group tabs như thế này ạ:

Một số nội dung ở tab khác, mình đang muốn chạy 1 đoạn javascript khi đối tượng ở tab khác được mở và nhìn thấy bởi người dung, mình thử add (click)=“runcode()” vào button trên tab khi ấn vào thì nó chạy nhưng code mình chạy trước khi tab được mở nên không có tác dụng, xin mọi người hướng dẫn, thanks ạ

Chien Dang viết 18:09 ngày 01/10/2018

Thay vì gán vào onclick (cho button), bạn gán vào sự kiện focus()(cho tab) xem?

Còn ko để cho chắc ăn, dùng setTimeOut đi, để 1s sau khi click để chắc chắn người dùng đã nhìn thấy chẳng hạn:

setTimeout(function(){ alert("Hello"); }, 1000);

Tên Gì Cũng Được viết 18:14 ngày 01/10/2018

nếu là bootstrap thì
https://www.w3schools.com/booTsTrap/bootstrap_ref_js_tab.asp

Hung viết 18:11 ngày 01/10/2018

Trong Angular, để bắt sự kiện khi child view đã load xong có 2 lifecycle method:

ngAfterViewInit()
ngViewAfterViewChecked()

Khi bắt đầu tạo và hiển thị component, Angular gọi ...init(), rồi đến ...checked() sau.
Sau đối mỗi lần thực hiện browser’s JS cycle thì chỉ gọi ...checked() nếu property và @Input() thay đổi.

Giờ chỉ cần dùng component class implements interface ViewAfter và hiện thực ngViewAffterChecked(), gọi setTimeout(()=>{},0), trong callback bạn thay đổi property hay thực hiện logic nào cũng được. Lý do gọi setTimeout() để qua 1 browser cycle thì các property mới gán được (nếu không thì bị throw error).

export class AppComponent extends Component implements AfterView {
  ngAfterViewChecked() {
    setTimeout(() => {
      this.onViewChecked();
    }, 0);
  }

  onViewChecked() {
    // your implementation
  }
}

Bình luận về bài viết này

Chia sẻ tin đăng đến bạn bè

Gửi Messenger

Bài liên quan

Bảo Ngọc

0 chủ đề

0 bài viết

Tác giả nổi bật