Angular2 Unhandled Promise 拒绝：模板解析错误：

Question

我是 Angular2 的新手，正在创建一个基本应用程序。但是当我运行应用程序时，它给出了一些错误。

这是我正在研究的 plunker 的链接： https://plnkr.co/edit/vnnVJtA7HJS740tvslEI?p=preview

请提供解决方案，以便我可以从 Angular2 开始。以下是错误：

VM654 zone.js:388 Unhandled Promise rejection: Template parse errors:
'courses' is not a known element:
1. If 'courses' is an Angular component, then verify that it is part     
of this module.
2. If 'courses' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" 
to the '@NgModule.schemas' of this component to suppress this  
message. ("
<div>
  <h2>Hello {{name}}</h2>
  [ERROR ->]<courses></courses>
   </div>"): App@3:6 ; Zone: <root> ; Task: Promise.then ; Value:   
Error: Template parse errors:(…) Error: Template parse errors:
'courses' is not a known element:
1. If 'courses' is an Angular component, then verify that it is part   
of this module.
2. If 'courses' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA"   
to the '@NgModule.schemas' of this component to suppress this 
message. ("
<div>
  <h2>Hello {{name}}</h2>
  [ERROR ->]<courses></courses>
   </div>"): App@3:6
at TemplateParser.parse     
(https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:8446:21)
at RuntimeCompiler._compileTemplate    
(https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:16824:53  
)
at eval  
(https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:16746:85 
)
at Set.forEach (native)
at compile  


(https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:16746:49   
 )
at ZoneDelegate.invoke 
(https://unpkg.com/zone.js@0.6.26/dist/zone.js:232:26)
 at Zone.run (https://unpkg.com/zone.js@0.6.26/dist/zone.js:114:43)
 at https://unpkg.com/zone.js@0.6.26/dist/zone.js:502:57
 at ZoneDelegate.invokeTask 
 (https://unpkg.com/zone.js@0.6.26/dist/zone.js:265:35)
 at Zone.runTask 
(https://unpkg.com/zone.js@0.6.26/dist/zone.js:154:47)consoleError @ 
VM654 zone.js:388_loop_1 @ VM654 zone.js:417drainMicroTaskQueue @ 
VM654 zone.js:421ZoneTask.invoke @ VM654 zone.js:339
VM654 zone.js:390 Error: Uncaught (in promise): Error: Template parse   
errors:(…)

Answer 1

您需要进行两项更改，

1)。删除了 directives:[CourseComponent] 和

declarations: [ App,CourseComponent ]   //#### added CourseComponent here

2) 将 # 更改为 let 密钥

<li *ngFor="let course  of courses"> 

演示：https://plnkr.co/edit/U42S7joZT7wMCr1oBF9h?p=preview