Posts

Showing posts with the label Http Error

Angular 2/4/5/6/7-Custom Table component with Sort,Filter,Pagination with data from a complex JSON Array-Complete Guide(code snippet)

Image
Table GUI //step 1 install ngb bootstrap npm package npm install --save @ng-bootstrap/ng-bootstrap main.module.ts import { NgbPaginationModule} from '@ng-bootstrap/ng-bootstrap/'; @NgModule({ declarations:[], imports: [ NgbPaginationModule.forRoot() ] }) sample.component.html <div class="row" style="padding-top:3px;"> <div class="col-sm-5"> <label class="control-label"> Records per page <label> <input [(ngModel)]="itemsPerPage" style="width:50px" class="form-control" type="text"> </label> </label> <label class="control-label"> Total records: <label class="info-text"> {{TotalCount}} </label> </label> </div> <div *ngIf="count > itemsPerPage" class="col-sm-7 "> <div class=" pull-right...

Angular 2/4/5/6/7-Reusable Custom Bootstrap Modal Dialog Angular Component(3 ways)

//step 1 install ngb bootstrap npm package npm install --save @ng-bootstrap/ng-bootstrap main.module.ts import { NgbModalModule } from '@ng-bootstrap/ng-bootstrap/'; import { ModalComponent} from '/modal-dialog.component'; @NgModule({ declarations:[ModalComponent], imports: [ NgbModalModule.forRoot() ] }) modal-dialog.component.ts import { Component, Input, Output, EventEmitter } from '@angular/core'; import { NgbModal } from '@ng-bootstrap/ng-bootstrap/modal/modal.module';@Component({ selector: 'modal-dialog', template: ` <div class="confirm" [handle]="modalHandle" *ngIf="show" ngDraggable> <div class="modal-dialog" > <div class="modal-content"> <div class="modal-header cursor" #modalHandle> <button type="button" class="close" data-dismiss="modal" (click)="closePopUp()" aria-hidden=...

Angular 2/3/4/5/6/7 global http error handling for Angular HTTP calls

http-error.service import { Injectable, OnInit } from '@angular/core'; import { ErrorObservable } from 'rxjs/observable/ErrorObservable'; import { HttpErrorResponse } from '@angular/common/http'; import { Router } from '@angular/router'; @Injectable() export class HttpErrorService { constructor(private router:Router){ } errorMessage="Something bad happened; please try again later."; handleError(error: HttpErrorResponse) { if (error.error instanceof ErrorEvent) { // A client-side or network error occurred. Handle it accordingly. console.error('An error occurred:', error.error.message); } else { // The backend returned an unsuccessful response code. // The response body may contain clues as to what went wrong, let status=error.status; if(status==406 || status ==410 || status==401){ this.errorMessage = "expired" ...