角2私のバックエンドから私の残りのAPIを取るために私のサービスを変更する

Question

私は私のノードのバックエンドから残りのAPIを取るように私の配列を交換しようとしていますが、またはそれを行うために必要なモジュール。どのようなものなのか、私はそれを輸入するはずです。サービスは現在サイトで動作しますが、ノードが動作しているときのREST 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); 
    } 
} 

Answer 1

私が正しく理解していれば、あなたはバックエンドからのものを使用して、静的な記事を交換したいです。その場合は、このような何かを試してみてくださいと述べ

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内の特定のアイテムを返すあなたのバックエンドです。私はなぜあなたが正面に自分自身をフィルタリングしているのかわかりませんが、確かにあなたの理由があります...