Angular ngOnInit 允许订阅吗？

Question

In most of the tutorials I've been following, they say to always do a subscription within the constructor ie:

constructor(private eventDetailsService: EventDetailsService) {
      this.subscription1 = this.eventDetailsService.reload$
            .subscribe(
            response => {
                this.eventDetail = response;
            });
}

And then to destroy the subscription within ngDestroy:

ngOnDestroy() {
        this.subscription1.unsubscribe();
    }

I have a particular component where I need to do some logic within ngOnInit first to workout whether I need to call the subscription in the first place. It allows me to do the subscription within ngOnInit without any errors, but I was wondering if there is a consequence of doing this?

ngOnInit() {
   if ((this.activatedRoute.parent.snapshot.parent.params.eventId != undefined))
        {
            this.subscription1 = this.eventDetailsService.reload$
            .subscribe(
            response => {
                this.eventDetail = response;
            });
        }
}

Answer 1

Yes, it's good practice to subscribe in the onInit() method.
I would recommend to use your constructor only to declare your dependency injections.
In this particular case though, you might run into an error when you leave your component since there's a possibility that your subsciption equals undefined when you call on destroy (you put your code in a if statement). You can declare your params as an observable to prevent this:

    ngOnInit() {
        const eventId$ = this.route.parent.parent.params.pipe(
            map((params: Params) => params.get('eventId')),
            filter(id => !!id)
        );
        this.subscription = eventId$.pipe(
            mergeMap(() => this.eventDetailsService.reload$())
        ).subscribe(response => {
            this.eventDetail = response;
        });
    }

    ngOnDestroy() {
        this.subscription.unsubscribe();
    }

By doing so, your observable will only emit when you have the eventId param in your route and your subscription is safe to be unsubscribed once you destroy the component.
Also, If you navigate to the same component with a different eventId param, this observable will emit the new eventId value and retrigger your logic.

Answer 2

It is even good practice to put your Subscription s into the ngOnInit() , as you want to initialize the data as soon as possible and display data directly when you access the component and update the UI.

There are no consequences, as you already .unsubscribe() in your ngOnDestroy() step.