I update a shown value from a subscription, why is my new value not shown?

I have an Angular component that shows a member variable of its TypeScript class. I subscribe to an rxjs Observable to update the value. I see that my rxjs Subscription is executed, but the new value is not shown. Here is my TypeScript class:

export class AppComponent implements OnInit, OnDestroy {
myValue = "Initial";
title = 'example';
subject = new Subject<string>();
subscription: Subscription | undefined;

ngOnInit(): void {
const observable = this.subject as Observable<string>;
this.subscription = observable.subscribe(this.update);
this.subject.next('New value');
}

update(value: string) {
console.log(`Updating to ${value}`);
this.myValue = value;
}

ngOnDestroy(): void {
this.subscription?.unsubscribe();
}
}


The shown member is myValue. When I execute this app I see "Initial", not "New value", even though I can see Updating to New value in the console.

Why don't I see my update?

Continue reading...