I am sending a post request with two parameters i.e. pubid and pubdate on keypress eventchanged in angular now I am looking to get the Autocomplete data after post request for the Title field. but autocomplete does not work.
JSON data
[{
"ID": "44",
"Title": "Saturn"
}]
app.component.ts
ngOnInit() {
filter(val: string): Observable<any[]> {
this.searchField.valueChanges
.pipe(
debounceTime(500),
distinctUntilChanged(),
map((val) => {
this.http.post<any>('http://localhost:3000/articles/articleslistData', { pubid: '3',pubdate: "2021-01-13" }).subscribe({
next: data => {
console.log(data);
},
error: error => {
this.errorMessage = error.message;
console.error('There was an error!', error);
}
})
})
)
}
}
app.component.html
<mat-form-field class="input-text js-input">
<input type="text" placeholder="Articles" aria-label="Number" matInput [formControl]="searchField" [matAutocomplete]="auto">
<mat-autocomplete #auto="matAutocomplete" [panelWidth]="600">
<mat-option *ngFor="let option of filteredArticle | async" [value]="option.Title">
{{option.Title}}
</mat-option>
</mat-autocomplete>
</mat-form-field>