在我的app.component.html中,
<div class="main">
<button type="button" (click)="onShowNotificationSideBar()" label="Show"></button>
<p-sidebar [(visible)]="notificationSideBarVisible" position="right" [style]="{width:'50em'}">
<button type="button" pButton pRipple (click)="showSuccess()" label="S" class="p-button-success"></button>
<button type="button" pButton pRipple (click)="showWarn()" label="W" class="p-button-warning"></button>
<button type="button" pButton pRipple (click)="showError()" label="E" class="p-button-danger"></button>
<h3>Messages</h3>
<h5>{{messages}}</h5>
<p-messages [(value)]="messages" [enableService]="false" ></p-messages>
</p-sidebar>
<p-toast position="center"></p-toast>
<router-outlet></router-outlet>
</div>
在app. component. ts中,
import { Component } from '@angular/core';
import { Message, MessageService } from 'primeng/api';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss'],
providers: [MessageService]
})
export class AppComponent {
title = 'WECO';
notificationSideBarVisible = false;
constructor(private messageService: MessageService) {
messageService.messageObserver.subscribe((m:Message | Message[])=>{
if (!Array.isArray(m)){
this.messages.push(m)
}
this.messages = [...this.messages];
});
}
onShowNotificationSideBar(){
this.notificationSideBarVisible=true;
}
count=0;
messages : Message[] = [
// { severity: 'success', summary: 'Success', detail: 'Message Content' },
// { severity: 'info', summary: 'Info', detail: 'Message Content' },
// { severity: 'warn', summary: 'Warning', detail: 'Message Content' },
// { severity: 'error', summary: 'Error', detail: 'Message Content' }
];
longSentence = 'Let’s end all this nonsense about how long sentences = run-on sentences. You can have a six-word run-on sentence (“I went shopping I ate donuts.”), while most of the sentences below are much, much longer than that and are not run-ons';//'And let’s end all this nonsense about how long sentences = run-on sentences. You can have a six-word run-on sentence (“I went shopping I ate donuts.”), while most of the sentences below are much, much longer than that and are not run-ons (except for a few examples like Jose Saramago). But whether the sentence is grammatically correct isn’t nearly as important as whether the sentence is fun or beautiful.'
showWarn(){
let detail='User Deleted a Weco Rule';
if (this.count++%5===0)
detail = this.longSentence;
this.messageService.add({severity:'warn', summary:'User Action', detail: detail});
}
showSuccess(){
let detail = 'Weco Rule 123 Saved';
if (this.count++%5===0)
detail = this.longSentence;
this.messageService.add({severity:'success', summary:'Service Call', detail:detail});
}
showError(){
let detail = 'api-call:get-factories returned 404';
if (this.count++%5===0)
detail = this.longSentence;
this.messageService.add({severity:'error', summary:'Service Call', detail:detail});
}
}
如果我打开边栏并添加一些消息,它们就会出现,但当我关闭并重新打开时,它们就消失了.
即使我可以看到消息变量仍然有它们.为什么?
P.S.
如果我再添加一些消息,我只能看到新的消息.