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


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

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

<div class="autocomplete" style=" float:left;">

<ng-template #itemTemplate let-item>
<a [innerHTML]="" > </a>
<ng-template #notFoundTemplate let-notFound>
<div [innerHTML]="notFound"></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 :


And I can access to Overview Component


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() {



onChangeSearch(search: string) 


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

const routes: Routes = [

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

Is this JavaScript?

When the form text input = “Transistor” you want to find the “id” (of 6)?

You could filter the parts array for input matching .name? I’d suggest ignoring case too, but that could get you the ID for a name in the parts array.

this is type script not java script
actually i have list parts
i need when write any text on input then go to list get his id
then add to url and access componentoverview