Angular2: рендеринг HTML доверенных символов и времени и & копировать

0

Я сталкиваюсь с проблемой при рендеринге & times в шаблоне Component.

@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>'
})
  • 1
    в чем проблема?
  • 0
    он отображается как текст "& times".
Показать ещё 3 комментария
Теги:
angular

3 ответа

2
Лучший ответ

Похоже, вы забыли поставить ; символ в конце последовательности.

Успешно выполнится следующее:

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

Plunker, например, использование

Поделиться
  • 0
    спасибо, это работает для меня
2

Для тех, кто интересуется DomSanitizationService в угловом 2.0.0 (выпуск), он был переименован в DomSanitizer.

import { Component, OnInit } from '@angular/core';
import { DomSanitizer, SafeHtml } from '@angular/platform-browser';

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit {
    public someSafeHtml: SafeHtml;

    constructor(
        private _domSanitizer: DomSanitizer) {
    }

    ngOnInit() {
        this.someSafeHtml = this._domSanitizer.bypassSecurityTrustHtml('&copy; Example.com');
    }
}
Поделиться
1

вы можете использовать DomSanitizationService для правильного разбора &times как показано ниже,

ДЕМО: 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);
 }

}

ИЛИ

как предложил @rinukkusu,

<a (click)="remove(i)">&times;</a>
Поделиться
  • 0
    это работает для меня только спасибо ; пропущенный
  • 0
    Я видел это ! Неважно. Это поможет вам где-нибудь в вашем угловом путешествии ...
Показать ещё 9 комментариев

Ещё вопросы

Сообщество Overcoder
Наверх
Меню