In my code, I have a screen where the url has an id. After an operation in that screen, the user clicks Done button and navigates to a list screen. The list screen has a filter field to filter elements from the list. My question is; how can I set that id(OperationId) of the url of the first screen to the filter field of the second screen when user navigates to the second screen after Done operation?

First screen/URL:

Second Screen/Where the ID will be set:

First Screen HTML:

<button mat-button class="green fuse-white-fg" matStepperNext
    [disabled]="disableCompleteButton" (click)="complete()">Done</button>

First Screen TS:

complete() {
    this._terminalService
        .saveScalesMaterialInputOutput(this.scaleMaterial)
        .subscribe(
            () => {
                    this._router.navigate([
                        "/terminal/transaction-list-collect",
                    ]);
                }
        );
}

Second Screen HTML:

    <mat-form-field fxFlex="40">
        <input matInput (keyup)="applyFilter($event.target.value)" placeholder="Filtrele">
    </mat-form-field>