エラー：クラス名（？？）のすべてのパラメータを解決できません

Question

パラメータを使用してクラスの新規インスタンスを作成しようとするとこのエラーが発生しますが、パラメータを使用しない場合はうまく動作します。何が問題なの？ここで

はここでクラス

export class Recipe { 
    public name: string; 
    public description: string; 
    public imageP: string; 

    constructor(name1: string, description1: string, imagePath1: string) { 
    this.name = name1; 
    this.description = description1; 
    this.imageP = imagePath1; 
    } 

} 

である代わりに、私はそれぞれrecipe.tsレシピ-list.component.tsでこれを行う場合、コンポーネント

import {Component, OnInit, Output} from '@angular/core'; 
import { Recipe } from '../recipe'; 

@Component({ 
    selector: 'rb-recipes-list', 
    templateUrl: './recipes-list.component.html', 
    providers: [ Recipe ] 
}) 
export class RecipesListComponent implements OnInit { 

    theRecipe: Recipe = new Recipe('New', 'blah blah blah', 'ddkkkiskxmdks'); 

    recipe = this.theRecipe.name; 

    constructor() { } 

    ngOnInit() { 
    } 

} 

です：

export class Recipe { 
    public name: string = 'hello world'; 
    public description: string = 'hello world'; 
    public imageP: string = 'hello world'; 

} 


import {Component, OnInit, Output} from '@angular/core'; 
import { Recipe } from '../recipe'; 

@Component({ 
    selector: 'rb-recipes-list', 
    templateUrl: './recipes-list.component.html', 
    providers: [ Recipe ] 
}) 
export class RecipesListComponent implements OnInit { 
    //recipes: Recipe[] = []; 

    theRecipe: Recipe = new Recipe() 

    recipe = this.theRecipe.name; 

    constructor() { } 

    ngOnInit() { 
    } 

} 

は完全に機能します。

Answer 1

問題がこのキーワード

export class RecipesListComponent implements OnInit { 

    theRecipe: Recipe = new Recipe('New', 'blah blah blah', 'ddkkkiskxmdks'); 

    // recipe = this.theRecipe.name;   //<<<===removed this line 

    recipe = theRecipe.name;     //<<===removed this keyword 

} 

UPDATEにする必要があります：私はちょうどこれをテストし、完璧に動作します。

export class RecipesListComponent implements OnInit { 

    theRecipe:Recipe; 

    constructor(){ 
     this.theRecipe = new Recipe('New', 'blah blah blah', 'ddkkkiskxmdks'); 
     console.log(this.theRecipe.name); 
    } 
    .... 
} 

OR

export class RecipesListComponent implements OnInit { 

     theRecipe:Recipe; 
     theRecipe = new Recipe('New', 'blah blah blah', 'ddkkkiskxmdks'); 
     constructor(){ 
      console.log(this.theRecipe.name); 
     } 
     .... 
} 

NOTE。 providers:[Recipe]を削除します（その必要はありません）。 をインポートするだけで、すでに使用している場所であればいつでも使用できます。

アップデート1：私は、あまりにもplunkerとその作業でそれをテストしている

DEMO：https://plnkr.co/edit/Vxdeyjwdjol9TnVhCV19?p=previewチェックブラウザのコンソール。