This Google Slides Desugar Meteor, Angular 2, RxJS 5, and ngrx helps you have a deep understanding of Meteor, Angular 2, and ngrx and good practice.
Have fun learning! And feel free to comment.
This Google Slides Desugar Meteor, Angular 2, RxJS 5, and ngrx helps you have a deep understanding of Meteor, Angular 2, and ngrx and good practice.
Have fun learning! And feel free to comment.
Nice overview! Do you have a simple angular2-meteor example project featuring ngrx store and effects?
Not yet, but I will provide a simple demo soon when I get free time! : )
UPDATED: New Observable based Meteor API release! No need to wrap manually.
Check 🎤 New Observable based Meteor API (beta) release!
Thanks @Hongbo_Miao. Looks really promising (no pun intended ;))
So I was wondering how you would use this to do a dynamic query that is reactive. So having reactive updates for a query that is not the entire published collection ( xyz.find({})
) but rather a more specific query for which you don’t know the exact parameters up front?
So take this for example,
loadMessages(chatId: string, messageLimit: number): Observable<Message[]> {
return Observable.create(observer => {
this.subscribe('messages.messages', chatId, messageLimit, () => {
this.autorun(() => {
const messages = Messages.find({ chatId }, { sort: { timestamp: 1 }}).fetch();
observer.next(messages);
});
});
});
}
I call loadMessages
again when need, and give a different chatId
or messageLimit
.
Note new released Observable based Meteor API (beta) will be different. No need to do those wrapping things by ourselves. Make sure you have a look.
What is meant by “Desugar”? I do not understand and duckduckgo reveals no answers.
sorry, I don’t have myself now… It should be very similar. U can try, if u get stuck, you can post the problem here
say the tech like magic, “desugar” just means let us know how it really works. Hope I use the correct word, lol
@Injectable()
export class NotificationDataService extends MeteorComponent implements OnInit {
notifications: Observable < Notification[] > ;
data: Notification[];
notificationSub: Subscription;
constructor(private ngZone: NgZone) {
super();
}
ngOnInit() {
}
subscribeNotifications(userId: string): Observable < Notification[] >
let notificationsOptions = {
sort: { updatedAt: -1 }
};
this.notificationSub = MeteorObservable
.subscribe('notifications', notificationsOptions, userId)
.subscribe(() => {
this.notifications = Notifications.find({ notificationToId: userId },
notificationsOptions)
.debounce(() => Observable.interval(50))
.zone();
this.notifications.subscribe(data => {
this.data = data.sort(function(a, b) {
if (a.updatedAt > b.updatedAt) {
return -1;
} else if (a.updatedAt < b.updatedAt) {
return 1;
}
return 0;
});
}, (error) => {
});
console.log("in service this.notifications object" + this.notifications);
});
}
// ngOnDestroy() {
// this.notificationSub.unsubscribe();
// }
getData(): Notification[] {
return this.data;
}
getSubscription(){
return this.notifications;
}
}
Step 1: Call subscribeNotifications with current userid
Step 2: Call getSubscription() or getData() - both are null.
Is this the right way to use services? Where to subscribe for the Subscription i.e in service or in component? Why i am not getting any results?
Sorry for lot of questions.
Update: i was accessing the service in component like this:
this.autorunSub = MeteorObservable.autorun().subscribe(() => {
this.ngZone.run(() => {
this.notifications = this.notificationDataService.subscribeNotifications(userId);
if(this.notifications){
this.notifications.subscribe(data => {
this.data = data.sort(function(a, b) {
if (a.updatedAt > b.updatedAt) {
return -1;
} else if (a.updatedAt < b.updatedAt) {
return 1;
}
return 0;
});
}, (error) => {
});
} else
console.log("notification not ready");
});
});
Hi @Urigo is there a demo somewhere to show how to use new meteor-rxjs with Angular 2 Service? thanks!
not sure… do you think it could fit into Socially?
Where?
Hmm, basically all server related codes and app states can be moved to Service. But will be some work.
For a small demo, @dotansimha definitely can create a demo faster than me, since he contributes on meteor-rxjs a lot.