角度2解析テンプレートエラー

Question

角度2を初めて使用しました。角度-rc-4バージョンを使用しています。

角度2をブートストラップアイコンと組み合わせると、テンプレートを解析できません。

予期しない終了タグ "李は" あなたの助けの下

ため

おかげで私のコードです：

import { Component } from '@angular/core'; 
import { CourseService } from './course.service'; 
import { AutoGrowDirective } from './auto-grow.directive'; 

@Component({ 
    selector: 'courses', 
    template: ` 
     <h2>Courses</h2> 
     {{ title }} 
     <input autoGrow [(ngModel)]="title"/> 
     <input type="button" (click)="title = ''" value="Clear"> 
     Preview 
     {{ title }} 
     <ul> 
      <li *ngFor="let course of courses"> 
       <i class="glyphicon glyphicon-star" /> 
      </li> 
     </ul> 

     <div (click)="onDivClick()"> 
      <button class="btn btn-primary" [class.active]="isActive" (click)="onClick($event)">Create</button> 
     </div> 
     `, 
    providers: [CourseService], 
    directives: [AutoGrowDirective] 
}) 
export class CoursesComponent { 
    title = 'The title of courses page'; 
    courses: string[]; 
    isActive = true; 

    constructor(courseService: CourseService) { 
     this.courses = courseService.getCourses(); 
    } 

    onClick($event){ 
     $event.stopPropagation(); 
     console.log('Clicked', $event); 
    } 
    onDivClick($event){ 
     console.log('On Div Clicked', $event); 
    } 
} 

Answer 1

iタグは、あなたがする必要があり、自己終了タグではありません手動で閉じます。 liと同様に<i>タグを閉じることを忘れました& ngForディレクティブliが終了しました。

テンプレート

<ul> 
    <li *ngFor="let course of courses"> 
     <i class="glyphicon glyphicon-star"></i> 
    </li> 
</ul> 

Answer 2

セルフクロージング要素が正しく2とnot planned on be implemented角度によって解析されません。

<li *ngFor="let course of courses"> 
    <i class="glyphicon glyphicon-star"></i> 
</li> 

---

をGithub Issueから：あなたは正しくすべてのタグを閉じるために持っている理由です

：

我々は多くのオプションがここにあると考えるが結論であります

それが将来的に自動閉鎖または欠落終了タグ

あるカスタム要素を越えてくる場合は、デフォルトのHTMLパーサーは、私たちが自己終了カスタム要素をサポートすることができ、カスタムテンプレートパーサを使用することが容易になりますがスローされます

推論：

• 現在の角度HTMLテンプレートが有効なHTML5の断片である（でも、大文字と小文字の区別を変更した後、彼らは有効なHTML5もしますが、 高い忠実度で）
• カスタム要素の仕様は、現在、カスタム要素は、我々は標準から逸脱してはならない自動閉鎖または無効
• にすることはできません
• 我々はかかわらず、使いやすさを気にして私たちはオーサリングすることを可能にするだろう理由です他の構文のテンプレート（例： xhtml5、custom stuff、jade、何でも）
• 私たちはベータプレッシャーの下にあるので、デフォルトの動作についての決定を急いでいません。でも、デフォルトのパーサーの（近い）将来 にこのルールを緩和破壊変更なしに可能である（ 逆ではない）