product-list.component.js

import { Component, OnInit } from '@angular/core';
import { Product } from '../shared/models/character';
import { ProductService } from './character.service';

@Component({
  selector: 'product-list',
  templateUrl: './app/products/product-list.component.html',
  providers: [ProductService]
})

export class CharacterListComponent implements OnInit {
  products:Character[];

  constructor(private productService: ProductService) {} //if i use constructor i get: "cannot resolve all parameters" error
  //productService = new ProductService(); <- using like this it works, but... you know.
  // but then i get "can not read get property of undefined" error in the product service

  errorMessage: string;

  ngOnInit(): void {
    this.productService.getAll().
      subscribe(products => this.products = products,
      error => this.errorMessage = <any>error);
  }
}

product.service.js

import { Injectable } from '@angular/core';
import { Http, Response, Headers, RequestOptions } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/do';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/map';
import { Product } from '../shared/models/product';

@Injectable()

export class ProductsService {
  private productsUrl: string = 'http://localhost:2403/products';

  constructor(private http: Http) {}

  getAll(): Observable<Product[]> {
    return this.http.get(this.productsUrl)
      .map((response: Response) => <Product[]>response.json())
      .do(data => console.log('Products'));
  }
}