I am facing an issue where my NotificationsBellComponent is not receiving changes to the array in the service even though the _LocalStorageService is returning data correctly.
Q) How can I ensure that my component receives updates when the service collection changes?
Current implementation of the component:
@Component({
selector: 'notifications-bell',
directives: [],
templateUrl: 'build/components/notificationsBell/notificationsBell.html',
styles: [`
button{
background: none !important;
background-color: none !important;
box-shadow: none !important;
}
`]
})
export class NotificationsBellComponent {
private notifications: string[];
constructor(
private _platform: Platform,
private _nav: NavController,
private _events: Events,
private _ConfigService: ConfigurationService,
private _NotificationService: NotificationService
) {
this.notifications = this._NotificationService.notifications;
}
}
Current implementation of the service:
@Injectable()
export class NotificationService {
public notifications: string[];
constructor(
private _ConfigService: ConfigurationService,
private _LocalStorageService: LocalStorageService,
private _I8nService: I8nService,
private _events: Events
) {
this.getData();
}
getData() {
this._LocalStorageService.getNotifications().then((data) => {
var list: string[] = [];
if (data.res.rows.length > 0) {
for (var i = 0; i < data.res.rows.length; i++) {
list.push(data.res.rows.item(i).notification);
}
}
this.notifications = list;
});
}
addItem(description: string) {
this._LocalStorageService.addNotification(description).then(() => {
this.getData();
});
}
}