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'}