OR

Question

在组件模板中渲染＆amp; times 时，我遇到了问题。

@Component({
    selector:'my-app',
    template:`
    <div>
    <input [(ngModel)]="toDoModel" type="text">
    <button (click)="onClickToDo(toDoModel)">Click me</button>      
    <ul>
        <li *ngFor="let item of todoList; let i = index">{{item}}
          <a (click)="remove(i)">&times</a>
        </li>
    </ul>
    </div>`
})

Answer 1

看起来您忘了将;字符放在序列的末尾。

以下内容将成功呈现：

<a (click)="remove(i)">&times;</a>

Plunker例如用法

Answer 2

对于那些对角度2.0.0（发布版）中的 DomSanitizationService 感兴趣的人 - 它已被重命名为 DomSanitizer 。

Timestamp.valueOf(String)

Answer 3

您可以使用 DomSanitizationService 正确解析&times，如下所示，

DEMO ：https://plnkr.co/edit/4X2vINBbXmaJ0eHZ9ZZX?p=preview

import {DomSanitizationService} from '@angular/platform-browser';

@Component({
    selector:'my-app',
    template:`
    <div>
    <input [(ngModel)]="toDoModel" type="text">
    <button (click)="onClickToDo(toDoModel)">Click me</button>      
    <ul>
        <li *ngFor="let item of todoList; let i = index">{{item}}
          <a (click)="remove(i)" [innerHTML]="myHTML"></a>
        </li>
    </ul>
    </div>`
})

export class AppComponent{

 dangerousUrl='<span>&times</span>';

 constructor(sanitizer: DomSanitizationService) {   
    this.myHTML= sanitizer.bypassSecurityTrustHtml(this.dangerousUrl);
 }

}

OR

正如@rinukkusu建议的那样，

<a (click)="remove(i)">&times;</a>

Angular2：渲染Html可信任字符×和©

3 个答案:

OR