How to show results only when user types in the search box?

below is my html and typescript code

<ais-instantsearch [config]="comment">
  <ais-search-box></ais-search-box>
  <ais-hits>
    <ng-template let-hits="hits">
      <div class="row">
        <div *ngFor="let hit of hits" class="col-4">
          <div class="comments">
            <ais-highlight attribute="name" [hit]="hit"> </ais-highlight>
            <h6>{{hit.email}} </h6>
            <p> {{hit.body}}</p>
          </div>
        </div>
      </div>
    </ng-template>
  </ais-hits>
</ais-instantsearch>

comment={
    apiKey: 'apikey',
    appId: 'apiid',
    indexName: 'comment',
  }

[francoischalifour]

The ais-hits widget provides the results value containing the current query. You can conditionally show the results based on results.query.

<ais-hits>
  <ng-template let-hits="hits" let-results="results">
    <div *ngIf="results.query">
      <!-- only show results if the query is not empty -->
    </div>
  </ng-template>
</ais-hits>

[dmsammusic]

Hi could u update the code to latest Angular 14v and Anguar-Instantsearch to v4, because i am using the same code throws error. the no result content always shows.