Использование пользовательского DomSanitizer с Ivy

Я использую ng-dompurify в приложении Angular 9 и заменил Angular DomSanitizer по умолчанию реализацией NgDompurifyDomSanitizer.

@NgModule({
    // ...
    providers: [
        {
            provide: DomSanitizer,
            useClass: NgDompurifyDomSanitizer,
        },
    ],
    // ...
})

Таким образом, когда вы делаете такие вещи, как

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

DomPurify будет использоваться для очистки этой строки HTML.

Это прекрасно работает, когда я не использую Ivy, но когда я использую Ivy, визуализированный HTML дезинфицируется чем-то другим, кроме NgDompurifyDomSanitizer. Я не уверен, какое дезинфицирующее средство используется в этом случае, но я вижу, что атрибуты стиля удаляются из html-элементов, чего не произошло бы, если бы использовался NgDompurifyDomSanitizer.

Я собрал здесь пример stackblitz, показывающий проблему: https://stackblitz.com/edit/angular-domsanitizer-ivy. Если вы зайдете в настройки stackblitz и снимите флажок «Включить Ivy», вы увидите, что текст отображается красным, но когда он установлен, встроенный стиль удаляется, а текст становится черным.

Я не уверен, что мне нужно сделать что-то особенное, чтобы это работало с Ivy, или это не поддерживается с Ivy. Я гуглил большую часть дня, пытаясь понять это, но мне не повезло.

Я был бы признателен за любое понимание, которое у кого-то может быть.

РЕДАКТИРОВАТЬ: Для тех, кто заинтересован, это действительно ошибка, и я открыл тикет: https://github.com/angular/angular/issues/36794


angular9 angular-ivy angular-dom-sanitizer dompurify
person David Harris    schedule 10.04.2020    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Для тех, кому интересно, Кристиан Костадинов из команды angular опубликовал решение для тикета, который я открыл по адресу: https://github.com/angular/angular/issues/36794

Он сказал.

Я думаю, проблема в том, что вы должны предоставлять Sanitizer, а не DomSanitizer. Вот рабочий пример: https://stackblitz.com/edit/angular-domsanitizer-ivy-facotn

И изменение кода на это, кажется, работает:

@NgModule({
    // ...
    providers: [
        {
            provide: Sanitizer,
            useClass: NgDompurifyDomSanitizer,
        },
    ],
    // ...
})
person David Harris    schedule 17.08.2020