Угловой 5: Отображение HTML и XML из ответа сервера - PullRequest
0 голосов
/ 26 апреля 2018

У меня есть сценарий, в котором мне нужно отобразить html и xml из той же строки, отправленной с сервера.

Ответ с сервера выглядит так:

This is sample text with <b>bold text</b> and also some xml like this <note><to>you</to><from>me</from><heading>title</heading><body>message</body></note>. As you can see it contains both xml to display and html to render.

Я пытался:

text;
msg = 'This is sample text with <b>bold text</b> and also some xml like this <note><to>you</to><from>me</from><heading>title</heading><body>message</body></note>. As you can see it contains both xml to display and html to render.'

constructor(private domSanitizer: DomSanitizer) {
}

ngOnInit() {
    this.text = this.getInnerHTMLValue();
}

getInnerHTMLValue() {
    return this.domSanitizer.bypassSecurityTrustHtml(this.msg);
}

HTML:

Я получаю эту ошибку:

SafeValue must use [property]=binding:...

И когда я использую [innerHTML] вместо [innerText], xml был очищен.

Как я могу отобразить пример xml-кода вместе с разбором html-тегов, таких как <b>? Как минимум, как я могу избавиться от этой ошибки?

1 Ответ

0 голосов
/ 27 апреля 2018

Боюсь, это будет невозможно. Посмотрите спецификации WC3 :

Пользовательские агенты должны обрабатывать элементы и атрибуты, которые они не понимать как семантически нейтральный; оставляя их в DOM (для DOM процессоры) и стилизация их в соответствии с CSS (для процессоров CSS), но не выводя из них никакого значения.

Это означает, что хотя элементы неизвестны вашему браузеру, они будут частью домена и, следовательно, не будут отображаться в тексте.

Ваши единственные решения будут либо кодировать все теги, кроме <b>, <i>, ... вы сами: <note> -> &#x3C;note&#x3E;, либо использовать что-то вроде уценки для форматирования.

Как самый простой обходной путь, просто используйте msg без очистки, как есть:

<code><pre>{{msg}}

Поскольку это не будет интерпретироваться, санитарная обработка не требуется. (Метки типа <b>, конечно, тоже не будут интерпретироваться.)

...