@DarCKoder

Error: Invalid providers for «MyTableComponent» — only instances of Provider and Type are allowed, got: [?undefined?] (ANGULAR 2)?

Добрый вечер.
Выводится ошибка вышеописанная ошибка.

1dd4ed13b78d4506b2379f222bdf444d.png

Скрипты компонента и сервиса (Полный код, сразу после скрина):
a5bfc8d47b724be8abd3927f82f77a29.png
myTable.component.ts
import { Component } from "@angular/core";
import { ProductsService } from "../index";

@Component({
	moduleId: module.id,
	selector: "my-table",
	templateUrl: "myTable.component.html",
	styleUrls: ["myTable.component.css"],
	providers: [ProductsService],
	inputs: ["rows"]
})
export class MyTableComponent {
	rows: number;
	info = [];
	categories = {
		category1: [],
		category2: [],
		category3: []
	};
	newProductName: string = "Default Name";
	newProductPrice: number = 0;

	constructor(private products: ProductsService) {}

	getCategory(product) {
		var result;
		if (product.price <= 300) {
			result = 'Category 1';
			this.categories.category1.push(product);
		} else if (product.price <= 700 && product.price > 300) {
			result = 'Category 2';
			this.categories.category2.push(product);
		} else if(product.price > 700) { 
			result = 'Category 3';
			this.categories.category3.push(product);
		}
		return result;
	}

	sort(cat) {
		let that = this;
		switch(cat) {
			case '*':
				sorting(this.info);
				break;
			case 1:
				sorting(this.categories.category1);
				break;
			case 2:
				sorting(this.categories.category2);
				break;
			case 3:
				sorting(this.categories.category3);
				break;
		}

		function sorting(category) {
			that.info.map(function(product) {
				product.hiddenByCategory = true;
			});
			category.map(function(product) {
				product.hiddenByCategory = false;
			});
		}
	}

	addProduct() {
		let product = {
			id: this.info.length + 1,
			name: this.newProductName,
			price: this.newProductPrice
		};

		this.info.push(product);
	}

	ngOnInit() {
		this.info = this.products.products.slice(0, this.rows);
	}
}

products.ts (Сервис)
import { Injectable } from '@angular/core';

@Injectable()
export class ProductsService {
	products = [
		{ id: 1, name: "product 1 ", price: 100 },
		{ id: 2, name: "product 2 ", price: 200 },
		{ id: 3, name: "product 3 ", price: 300 },
		{ id: 4, name: "product 4 ", price: 400 },
		{ id: 5, name: "product 5 ", price: 500 },
		{ id: 6, name: "product 6 ", price: 600 },
		{ id: 7, name: "product 7 ", price: 700 },
		{ id: 8, name: "product 8 ", price: 800 },
		{ id: 9, name: "product 9 ", price: 900 },
		{ id: 10, name: "product 10", price: 1000 }
	];

	addProduct(newProduct) {
		this.products.push(newProduct);
	}
}



Идентичный код здесь: plunker, единственное отличие, на планкере не выводит ошибок.

Если вы дочитали до этой строки, то большое спасибо вам, что равнодушно не прошли мимо.
Очень надеюсь на вашу помощь. Заранее БлагоДарю.
  • Вопрос задан
  • 318 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы