角度2改变我的服务,以便从我的后端采取我的休息api

时间:2017-03-21 20:41:16

标签: node.js rest api angular

所以我要交换我的数组,以便从我的节点后端获取一个休息api,但我不知道如何转换我的服务,所以它会这样做或为了这样做需要的模块。就像我应该为它导入的东西一样。该服务当前与站点一起使用,但是在节点运行时希望将数组交换为其余的api。

角度2服务

/**
 * Created by g62 on 23/01/17.
 */
export interface Article {
    // Unique Id
    id: string;
    // Ref on category belongs to
    categoryId: string;
    //genre
    genre: string;
    // The title
    title: string;
    // Price
    rating: number;
    //director
    director: string;
    //cast
    cast: string;
    //production
    production: string;
    // Description
    description: string;
    // Plot
    plot: string;
    //opinion
    opinion: string;
    // Mark article with special rating
    isSpecial: boolean;
    // Path to small image
    imageS: string;
    // Path to large image
    imageL: string;
}

export class ArticleService {
// basic want to change this part so it accepts the rest api which is localhost:3000/api/article or something like that
    private articles: Article[] = [
        // Bakery
        { id: '1', categoryId: '1', title: 'Lion King', rating: 1.5, isSpecial: false, imageL: 'http://placehold.it/1110x480', imageS: 'http://placehold.it/270x171', director: 'some guy at disney', description: 'It a great movie about talking animals', plot:'disney plot', opinion:'one of my favorite movies', production: 'how was it made' },
        { id: '2', categoryId: '1', title: 'Big Hero 6', rating: 5, isSpecial: false, imageL: 'http://placehold.it/1110x480', imageS: 'http://placehold.it/270x171', description: 'It a movie about six kids and a puffy robot', plot:'disney plot', opinion:'my favorite movie in 2015',production: 'how was it made' },
        { id: '3', categoryId: '1', title: 'Lilo and Stitch', rating: 7, isSpecial: false, imageL: 'http://placehold.it/1110x480', imageS: 'http://placehold.it/270x171', description: 'A disney movie that takes place on Hawaii', plot:'disney plot', opinion:'my favorite disney movie',production: 'how was it made' }

    ];

    getArticles(category?: string, search?: string) {
        if (category) {
            return this.articles.filter((article: Article, index: number, array: Article[]) => {
                return article.categoryId === category;
            });
        } else if (search) {
            let lowSearch = search.toLowerCase();
            return this.articles.filter((article: Article, index: number, array: Article[]) => {
                return article.title.toLowerCase().indexOf(lowSearch) != -1;
            });
        } else {
            return this.articles;
        }
    }

    getArticle(id: string): Article {
        for (let i = 0; i < this.articles.length; i++) {
            if (this.articles[i].id === id) {
                return this.articles[i];
            }
        }
        throw new ArticleNotFoundException(`Article ${id} not found`);
    }
}

export class ArticleNotFoundException extends Error {
    constructor(message?: string) {
        super(message);
    }
}

1 个答案:

答案 0 :(得分:0)

如果我理解正确,您希望用后端的静态文章替换静态文章。如果是这种情况,请尝试以下方式:

private articles: Article[];

getArticles(): Observable<Article[]> {
    const url = `localhost:3000/api/article`;
    return this.http.get(url)
               .map(response => response.json() as Article[] )
               .subscribe(articles => this.articles = articles)
               .catch(this.handleError);
}

也就是说,它的后端通常会过滤或返回其ID中的特定项目。我不知道你为什么要在前面过滤自己,但你肯定有自己的理由......