How to generate url have partid based on part name written on text input using angular 7?

problem

How to generate URL have partid based on part name on text input ?

I have input text write on it part name as following :

navbar.component.html
<div class="autocomplete" style=" float:left;">
<ng-autocomplete 
[data]="parts"
[searchKeyword]="keyword"
(selected)='selectEvent($event)'
(inputChanged)='onChangeSearch($event)'
(inputFocused)='onFocused($event)'
[itemTemplate]="itemTemplate"
[notFoundTemplate]="notFoundTemplate"> 
</ng-autocomplete>

<ng-template #itemTemplate let-item>
<a [innerHTML]="item.name" > </a>
</ng-template>
<ng-template #notFoundTemplate let-notFound>
<div [innerHTML]="notFound"></div>
</ng-template>

</div>
<button id="btnautoSearch"><i class="la la-search m-0"></i></button>

I need when write on text input Transistor part then I will search on list parts and get partid =6 of part name Transistor then display it in URL as following :

localhost:4200/overview?partid=6
And I can access to Overview Component

navbar.component.ts

export class NavBarComponent implements OnInit {
keyword = 'name';
part = new FormControl('Air');
public parts = [

{
id: 1,
name: 'hummer',
},
{
id: 2,
name: 'ball',
},
{
id: 5,
name: 'Air',
},
{
id: 6,
name: 'Transistor',
}

];
ngOnInit() {
}

selectEvent(item) 
{

}
onFocused(e)
{

}
onChangeSearch(search: string) 
{

}

app-routing.module.ts represent routing as following :

const routes: Routes = [

{ path: 'overview', component: OverviewComponent },
{ path: '' , redirectTo: '/overview', pathMatch: 'full'}