Ruchir Naphade
asked on
Get search results without refreshing the page
I have search button where user inputs data (year,week,page) and gets data in grid format. When user wants to search for another data,i have to refresh the page to get correct data.
I want to get a correct data without refreshing the page manually. I think this has something to do with ngOnDestroy but I am not understanding how to impliment this.
I have gone through many questions and post but did not understand it properly.
Below is my code.
search-component.ts
search-component.html
Can anyone tell me how to get the correct data without refreshing the page?
I want to get a correct data without refreshing the page manually. I think this has something to do with ngOnDestroy but I am not understanding how to impliment this.
I have gone through many questions and post but did not understand it properly.
Below is my code.
search-component.ts
flyersearch(event, week: any, seite: any): void {
let temp = week.split('-W');
let jahr = temp[0];
let woche = temp[1];
let flyerBild: string;
this.flyerhammService.getFlyer(jahr, woche, seite)
.then(
flyers => {
this.flyers = flyers;
this.x = this.flyers[0].ArtNr;
}
).catch(
error => console.log(error)
);
}
search-component.html
<md-card class="default-card">
<h1>{{ 'Suche Flyer' }}</h1>
</md-card>
<md-card class="default-card">
<form id="flyer-search">
<table class="calender" cellspacing="0">
<tr>
<td>
<md-input-container>
<input mdInput placeholder="{{ 'Weak and Year' }}" type="week" #week name="week" value="2017-W17">
</md-input-container>
</td>
<td>
<md-input-container>
<input mdInput placeholder="{{ 'Seite' }}" type="number" #seite name="seite" value="01" min="01">
</md-input-container>
</td>
<td>
<md-card-actions align="end">
<button md-raised-button color="primary" (click)="flyersearch($event,week.value, seite.value)">
{{ 'Search' }}
<md-icon>search</md-icon>
</button>
</md-card-actions>
</td>
</tr>
</table>
</form>
</md-card>
<app-raster *ngIf="flyers!= null" [flyers]="flyers"></app-raster>
Can anyone tell me how to get the correct data without refreshing the page?
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Have you considered upgrading Angular and using HttpClient instead of Http?
Have you considered upgrading Angular and using HttpClient instead of Http?
ASKER
Nopes...I have not considered that option..should i update it? Even if i want to upgrade it, i have to first complete this and then i can upgrade from 4 to 6..
ASKER
This is my office work where I am using Angular 4 and in my university project, I am using Angular 5 which i want to upgrade it to Angular 6. I have been trying to upgrade it to 6 but facing some issues while doing so..I guess for that also i need your guidance. Although, I have gone through to Angular upgradation document but could not do it properly..but for my work that it not priority...
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
okay...i will try that..
ASKER
Thanks a lot Julian...!!
You are welcome.
ASKER
I changed my service from Promise to observable.I am sending search results from FlyerSearchComponent to Raster Component.
FlyerSearchComponent.ts
Open in new window
FlyerHammService.ts
Open in new window