這是一個設計方法問題。我（還）沒有損壞代碼。;-)
我有一個帶有多個模塊的 Firestore 連接的離子/角度應用程式。在整個使用程序中，用戶經常從一個頁面到另一個頁面/模塊移動到另一個模塊。
我系統的另一部分將新元素放入 Firestore 資料庫以回應外部事件。每當 Firestore 資料庫中出現新條目時，無論當前向用戶呈現哪個模塊/頁面，我都想在螢屏上生成一條新訊息。
從我的研究看來，我必須創建一個警報或彈出框或覆寫組件，然后將該組件包含在每個模塊中，并將其放置在每個模板檔案中，以便顯示訊息。似乎沒有一種方法可以撰寫一個覆寫組件，只要有適當的觸發器，它就會將自己推到正在呈現的任何其他內容上。
有沒有辦法在應用程式級別實作一次覆寫/警報/彈出而不撰寫代碼來處理每個模塊中的潛在覆寫/彈出/警報？
——保羅
uj5u.com熱心網友回復：
可以利用小吃店作為服務。配置模態的樣式，為模態傳遞資料（自定義訊息等）。https://material.angular.io/components/snack-bar/examples
MatSnackBar 是一個角度指令，用于專門在移動設備上顯示通知欄。這些型別的 UI 組件通常會使用多次。所以為了避免代碼的重復，可以簡單地創建一個服務來在不同的組件中使用 SnackBar。
要創建服務，您必須使用以下命令： ng gs snapBar 現在從@angular/core 匯入 MatSnackBar 并定義函式 openSnackBar（您始終可以使用不同的名稱）。
服務
import { Injectable } from '@angular/core';
import {MatSnackBar} from '@angular/material/snack-bar';
@Injectable({
providedIn: 'root'
})
export class SnackBarService {
//create an instance of MatSnackBar
constructor(private snackBar:MatSnackBar) { }
/* It takes three parameters
1.the message string
2.the action
3.the duration, alignment, etc. */
openSnackBar(message: string, action: string) {
this.snackBar.open(message, action, {
duration: 2000,
});
}
}
匯入snackBarService 并將其注入到組件的建構式中，您要在其中使用Snackbar。這將創建一個服務實體，比如snackBService。現在在snackBService 的幫助下，在需要的地方呼叫openSnackBar 函式。
零件
import { Component, OnInit } from '@angular/core';
import {SnackBarService} from '../snack.service';
@Component({
selector: 'app-profile',
templateUrl: './snackBar.html',
styleUrls: ['./snackBar.css']
})
export class SnackBar {
// create an instance of SnackBarService
constructor(private snackBService:SnackBarService) { }
//defining method for display of SnackBar
trigger(message:string, action:string)
{
this.snackBService.openSnackBar(message, action);
}
}
通過重復這些步驟，我們可以在任何組件中使用snackBar。例子：
<button (click)="trigger('This is a ', 'SnackBar')">
SnackBarButton
</button>
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/482572.html
上一篇：java學習之MybBaits