jeudi 20 juillet 2017

trying to create a dynamic ng2 search.service

I'm trying to create a dynamic ng2 search.service. REST services are the underlying protocol for searching for data in my org. Here's a user.service that I originally created which searches for users:

import { Injectable } from '@angular/core';
import { Headers, Http, Response } from '@angular/http';
import 'rxjs/add/operator/toPromise';
import { User } from '../entities/user';

@Injectable()
export class UserService {

    private headers = new Headers({ 'Content-Type': 'application/json' });
    private usersUrl = 'http://localhost:4000/users';
    private userUrl = 'http://localhost:4000/users/@id';

    constructor(private http: Http) { }

    getUser(id: number): Promise<User> {
        return this.http.get('http://localhost:4000/users/1')
            //return this.http.get(this.userUrl.replace('@id', id)) 
            .toPromise()
            //.then(this.extractData)
            .then(response => response.json())
            .catch(this.handleError);
    }

    getUsers(): Promise<User[]> {
        return this.http.get(this.usersUrl)
            .toPromise()
            .then(response => response.json())
            .catch(this.handleError);
    }

    private extractData(response: Response) {
        return response.json();
    }

    private handleError(error: any): Promise<any> {
        console.error('An error occurred', error); // for demo purposes only
        return Promise.reject(error.message || error);
    }
}

Here's my first attempts at a generic search.service:

import { Injectable } from '@angular/core';
import { Headers, Http, Response } from '@angular/http';
import 'rxjs/add/operator/toPromise';
import { User } from '../entities/user';

@Injectable()
export class SearchService
{
    private _headers = new Headers({ 'Content-Type': 'application/json' });
    private _entityName = '';
    private _allEntitiesUrl = 'http://localhost:4000/@entityNames';
    private _entityByIdUrl = 'http://localhost:4000/@entityNames/@id';

    constructor(private http: Http, entityName: string)
    {
        this._allEntitiesUrl = entityName + 's';
        this._entityByIdUrl = entityName + 's';
    }

    getEntity(id: number): Promise<User>
    {
        var url = this._entityByIdUrl.replace('@id', id.toString());
        return this.http.get(url)
            .toPromise()
            .then(response => response.json())
            .catch(this.handleError);
    }

    getEntities(): Promise<User[]>
    {
        return this.http.get(this._allEntitiesUrl)
            .toPromise()
            .then(response => response.json())
            .catch(this.handleError);
    }

    private extractData(response: Response)
    {
        return response.json();
    }

    private handleError(error: any): Promise<any>
    {
        console.error('An error occurred', error); // for demo purposes only
        return Promise.reject(error.message || error);
    }
}

The search.service is only partially complete right now. Here are some things that I know need to be updated:

  1. The import statement needs to be made generic or somehow accomodate the different types of entities that could potentially be returned from the search.service. For example, the search.service could potentially return accounts, products, etc:

    import { User } from '../entities/user';

  2. I need to figure out how to implement dynamic return types for getEntity/getEntities. I've done some work to implement methods to return generic types from C# in the past but not sure how this would be done with ng2/typescript

I'm sure I'm not the first person who has thought about doing this so hopefully others here who are more fluent in ng2/typescript can explain how I could implement this?

Aucun commentaire:

Enregistrer un commentaire