Перетаскивание компонента возвращает только исходный код

Question

Я хочу использовать пользовательскую форму с перетаскиванием, где пользователь выбирает поля ввода, выбирает поля, флажки и т. Д. c и создает собственную форму.

Проблема возникает, когда я в зона DRAG создает повторно используемые компоненты и переносит их в зону DROP. Я вижу только исходный код ... Вот рабочий пример . Попробуйте перейти от ролей к списку 1 некоторых элементов.

Заранее спасибо ...

Answer 1

при привязке URL-адреса в гиперссылке someValue будет очищено, поэтому злоумышленник не сможет внедрить, например, javascript: URL-адрес, который будет выполнять код на веб-сайте. Прежде чем внедрять его, вы должны доверять HTML. Вы должны использовать DomSanitizer для такой вещи.

export class injectComponent  {

    private _inputdata: string = '<input type="text" name="fname">';

    public get inputdata() : SafeHtml {
       return this._sanitizer.bypassSecurityTrustHtml(this._inputdata);
    }

    constructor(private _sanitizer: DomSanitizer){}
}

и в html

<div [innerHTML]="inputdata"></div>

я отредактировал ваш пример на stackblitz