Я настраиваю функцию уведомлений для своего приложения Angular.
В заголовке:
Заголовок вызывается только один раз после входа в систему, яесть значок с количеством непрочитанных уведомлений:
<button mat-icon-button>
<mat-icon matBadge="{{unreadNotifications}}" matBadgeColor="red" matBadgeOverlap="true" matBadgePosition="below after">
notifications
</mat-icon>
</button>
И мой контроллер:
notificationSub: Subscription;
ngOnInit() {
this.notificationSub = this.notifService.getAsyncNotifsCount().subscribe((res) => {
this.unreadNotifications = res;
});
}
Уведомления могут отображаться на странице уведомлений :
<div *ngFor="let notif of notifsBeforeRead" class="notif">
<div class="notif-title">{{ notif.Subject }}</div>
<div>{{ notif.Message }}</div>
<div class="notif-date">{{ notif.Date | date : 'medium' }}</div>
</div>
И мой контроллер:
notificationSub: Subscription;
this.notifService.apply({ collectionName: 'Links' }, myFilter);
this.notificationSub = this.notifService.getAsyncFilter()
.subscribe((links) => {
if (links.data && links.data.length) {
// this.resultsLength = links.options.documents.total;
this.resultsLength = 20;
Array.prototype.forEach.call(links.data, (link) => {
const notif = {};
link.attributes.forEach((attr) => {
notif['id'] = link._id;
notif['attributes'] = link.attributes;
link.attributes.forEach((att) => {
notif[att.name] = att.value;
});
});
if (Object.keys(notif).length) {
notifications.push(notif);
}
});
}
this.notifsBeforeRead = notifications;
this.notifications = _.cloneDeep(notifications);
// Mark notifications as read
this.updateReadNotif();
});
И мой notifService :
@Injectable()
export class NotifService {
filterSubject = new Subject<any>();
notifsCountSubject = new BehaviorSubject<any>(0);
apply(params = null, filter: any) {
const _resource = this.resource;
let targetURL = `${this.resourceApply}`;
if (params) {
targetURL += `?${queryParams(params)}`;
}
this.getData(targetURL, filter).subscribe((res) => {
this.filterSubject.next(res);
console.log(res.data);
let unreadNotifs = 0;
res.data.forEach((notif) => {
notif.attributes.forEach((attr) => {
if (attr.name === 'Lu' && attr.value === false) {
unreadNotifs += 1;
}
});
});
this.notifsCountSubject.next(unreadNotifs);
});
}
getData(targetURL, filter) {
this.resource = targetURL;
return from(super.create(filter));
}
getAsyncFilter() : Observable<any> {
return this.filterSubject.asObservable();
}
getAsyncNotifsCount(): Observable<any> {
return this.notifsCountSubject.asObservable();
}
}
Не весь код, но я думаю, выможет помочь мне только в этом.
Поэтому, когда я перехожу на страницу уведомлений, значок не обновляется.
Например: у меня есть 5 непрочитанных уведомлений.
Я перехожу на страницу уведомлений, поэтому я передаю этот код:
this.notifsCountSubject.next(unreadNotifs); // unreadNotifs = 0
Но значок в заголовкене обновляетсяЯ подписался на тему, когда я использую .next (), все подписчики должны были обновить свои данные, я прав?
Можете ли вы помочь мне, пожалуйста, спасибо.