Pipe operator not working when combining with async pipe in template for valuechanges observable

I am trying to capture user inputs and perform some business logic depending upon the inputs and bind the resulting data back to the form element. I hook into form valuechanges observable and perform my custom logic and bind the result to template.

I am trying to avoid subscribing from component and do it from template using async pipe as shown below. But if I am not subscribing from the component, logic is not triggering.

From my understanding since async pipe will subscribe to the observable, from component the pipe operation logic should work fine but is is not getting called unless I do another subscribe as shown below, can any one help me why it is not triggering the pipe operator logic since I already subscribed using async pipe in the template, please ? Thanks.

I tried moving the logic to ngAfterViewChecked hook still not working, if I subscribe from component it is working but I want to avoid multiple subscription.

import { Component, ViewChild, AfterViewInit } from '@angular/core';
import { NgForm } from '@angular/forms';
import { Observable } from 'rxjs';
import { tap, startWith } from 'rxjs/operators';

@Component({
    selector: 'app-check-value-changes',
    templateUrl: './check-value-changes.component.html',
    styleUrls: ['./check-value-changes.component.scss']
})
export class CheckValueChangesComponent implements AfterViewInit {
    @ViewChild('form') form: NgForm;
    valueChanges$: Observable<any>;

    ngAfterViewInit() {
        this.valueChanges$ = this.form.valueChanges;
        // Not Working
        this.valueChanges$.pipe(
            tap((c) => console.log(`Async pipe Subscribe ? - ${JSON.stringify(c)}`))
            // other business logic here
        );

        // Working fine
        this.valueChanges$.pipe(
            tap((c) => console.log(`Explicit Subscribe - ${JSON.stringify(c)}`))
            // other business logic here
        ).subscribe();
    }
}

<span *ngIf="valueChanges$ | async as value">
    {{ value | json }}
</span>
<form #form="ngForm">
    <input type="text" name="txtName" ngModel>
</form>