Különbségek

A kiválasztott változat és az aktuális verzió közötti különbségek a következők.

--- oktatas:web:angular:angular_bootstrap [2025/09/22 21:12] – [Modális ablak elrejtése változat 3] admin
+++ oktatas:web:angular:angular_bootstrap [2025/09/22 21:17] (aktuális) – [Toast] admin
@@ Sor 219: / Sor 219: @@
         Az adatok sikeresen mentésre kerültek.
       </div>
-      <button type="button" class="btn-close btn-close-white me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
+      <button type="button"
+      class="btn-close btn-close-white me-2 m-auto"
+      data-bs-dismiss="toast"
+      aria-label="Close"></button>
     </div>
   </div>
 </div>
+</code>
+TypeScript oldalon a megjelenítéshez szükséges:
+<code javascript>
+import { ElementRef, ViewChild } from '@angular/core';
+import { Toast } from 'bootstrap';
+</code>
+Szükségünk van egy hivatkozásra és egy névre.
+<code javascript>
+export class UserComponent {
+  @ViewChild('successToast') successToastRef!: ElementRef;
+  private successToast: Toast | undefined;
+</code>
+Készítsük elő a Toast-tot:
+<code javascript>
+  ngAfterViewInit() {
+    this.successToast = new Toast(this.successToastRef.nativeElement, {
+      delay: 5000
+    })
+  }
+</code>
+Ezt követően a megjelenítés:
+<code javascript>
+this.successToast?.show()
 </code>