Как добавить текстовое поле или HTML в нг-мульти-выбрать выпадающий в угловых 5

Question

В настоящее время у меня есть раскрывающийся список с выбором по умолчанию.Теперь я хочу добавить текстовое поле рядом со значением.

Первоначально я просто добавил чистый HTML в цитате, но он не работает, как я ожидал.Затем я попытался избежать двойных кавычек, но он все еще остается тем же

dummyArray: Array<any> = [{
    'pan_name': '',
    'pan_label':'',
    'pan_type':'Mul-select',
    'pan_field':'',
    'pan_value':[{'id':1,'name':'xxxx'+'<h2 class=/"fg-white/">AboutUs</h2>`'}]
}]

<div class="form-check">
    <label>{{field.pan_label}}</label>
    <ng-multiselect-dropdown [placeholder]="'Select'"
                             [data]="field.pan_value"
                             name="{{field.pan_field}}"
                             [(ngModel)]="field.pan_name"
                             [settings]="dropdownSettings">
    </ng-multiselect-dropdown>
</div>

Я хочу добавить текстовое поле рядом со значением.

Answer 1

Вы не можете привязать HTML напрямую к представлению по умолчанию по некоторым причинам безопасности (XSS). Angular предоставит вам сервис, который позволит вам дезинфицировать ваш HTML-контент и привязать его к представлению https://angular.io/api/platform-browser/DomSanitizer.

Например, вы можете создать канал, который вы можете использовать для очистки вашего HTML:

@Pipe({
  name: 'sanitizeHtml'
})
export class SanitizeHtmlPipe implements PipeTransform {
  constructor(private sanitizer: DomSanitizer) { }
  transform(value: any): any {
    return this.sanitizer.bypassSecurityTrustHtml(value);
  }
}