Encountered a problem with the home, create, and edit product pages.
After creating and saving data, it redirects to the home page where the latest products are displayed. Unfortunately, the newly created data does not update automatically until the page is manually refreshed.
Are there any tricks to refresh or reload the latest data? Here is my code:
Service
@Injectable()
export class httpServices {
public current_lang;
constructor(private http: HttpClient,private _translate:TranslateService) {
}
public getCategory() {
let categories = this.http.get(GlobalVariable.BASE_API_URL+"categories");
return categories;
}
public getSubProjects() {
let subprojects = this.http.get(GlobalVariable.BASE_API_URL+"subprojects");
return subprojects;
}
public getProductList() {
//return this.http.get("./assets/data/productlist.json");
let products = this.http.get(GlobalVariable.BASE_API_URL+"products/date");
return products;
}
}
Home ts
ngOnInit(){
this._httpService.getCategory().subscribe(data=>{
this.categoryFilterArray = data;
});
this._httpService.getSubProjects().subscribe(data=>{
this.subProjectFilterArray = data;
});
this._httpService.getProductList().subscribe(data=>{
this.projectListData = data;
});
}
Home HTML
<div *ngFor="let item of projectListData | filter : searchText">
<div class="project-wrap" [routerLink]="['/admin/project-detail/', item.id]">
<div class="project-img">
<img src="{{apibaseurl}}images/product_{{item.id}}.png?{{timestamp}}" alt="project" />
</div>
<div class="project-content">
<!-- <h3 tooltip="{{item.name}}" [tooltipDisabled]="false" [tooltipAnimation]="false"
tooltipPlacement="top">{{item.name}}</h3>-->
<h3 title="{{item.name}}">{{item.name}}</h3>
<label><b>{{ 'SUB_PROJECT' | translate}}:</b> {{ item.subProject.name | translate}}</label>
<label><b>{{ 'PROJECT_CATEGORY' | translate}}:</b> {{ item.category.name | translate}}</label>
<label><b>{{ 'STATUS' | translate}}:</b> {{ item.status | translate}}</label>
</div>
</div>
</div>
Create
this.http.post(GlobalVariable.BASE_API_URL+'product/create', body)
.subscribe( resultArray => {
this.successMsg = "Product created successfully." ;
setTimeout((_router: Router) => {
this._router.navigate(['admin/home']);
}, 2000);
}