Refactoring de code de service angulaire

Question

J'ai suivi ce format dans mon application pour communiquer avec l'API et y récupérer des données.

Voici le code de l'un des service.ts

getCheckoutDetails(): Observable<UserDetail> { 
    let query = `7668`; 
    return this.http 
     .get(this.appConfig.getAPIUrl() 
      + `/buy/getDetails?${query}`) 
     .map(this.extractData) 
     .catch(this.handleErrors); 
} 


private extractData(res: Response) { 
    let data = res.json();  
    return data.body ? data.body.message ? data.body.message : {} : {}; 
} 

private handleErrors(error: Response | any) { 
    let errMsg: string; 
    if (error instanceof Response) { 
     const body = error.json() || ''; 
     const err = body.error || JSON.stringify(body); 
     errMsg = `${error.status} - ${error.statusText || ''} ${err}`; 
    } else { 
     errMsg = error.message ? error.message : error.toString(); 
    } 
    console.error(errMsg); 
    return Observable.throw(errMsg); 
} 

Maintenant, nous utilisons cpd pour détecter la duplication de code dans l'application et il se plaint que partout où j'utilise extractData et handleErrors le code est dupliqué.

Existe-t-il une meilleure façon de gérer cela en utilisant la classe de base?

Answer 1

Vous pouvez déplacer vos méthodes de classe de base quelque chose comme:

class BaseService { 
    constructor(
    private http: Http, 
    @Inject(AppConfig) private appConfig: AppConfig) {} 

    get(url: string) { 
    return this.http 
      .get(`${this.appConfig.getAPIUrl()}${url}`) 
      .map(this.extractData) 
      .catch(this.handleErrors); 
    } 

    private extractData(res: Response) { 
    let data = res.json(); 
    return data.body ? data.body.message ? data.body.message : {} : {}; 
    } 

    private handleErrors(error: Response | any) { 
    let errMsg: string; 
    if (error instanceof Response) { 
     const body = error.json() || ''; 
     const err = body.error || JSON.stringify(body); 
     errMsg = `${error.status} - ${error.statusText || ''} ${err}`; 
    } else { 
     errMsg = error.message ? error.message : error.toString(); 
    } 
    console.error(errMsg); 
    return Observable.throw(errMsg); 
    } 
} 

class DetailsService extends BaseService { 
    getCheckoutDetails() { 
    let query = '7668'; 
    return this.get(`/buy/getDetails?${query}`) } 
}