javascript - pipes - Angular 2: ¿Cómo se procesa HTML a partir de una respuesta JSON sin mostrar las etiquetas al usuario?

json.parse array

Question

Esta pregunta ya tiene una respuesta aquí:

• Enlace angular HTML 17 respuestas

Editar: una aclaración para cualquiera que solo haya leído el título, mi pregunta es sobre Angular 2 , no 1.

Tengo una plantilla de componente que es algo como esto:

<div>{{ post.body }}</div>

El objeto es algo como:

{
    "title": "Some Title",
    "body": "<p>The <em>post body</em>.</p>"
}

En lugar de representar el párrafo como:

El cuerpo del mensaje

muestra:

"<p>The <em>post body</em>.</p>"

Como es una tarea tan común, busqué una tubería incorporada como {{ post.body | safe }} {{ post.body | safe }} pero no vi ninguno.

¿Hay una manera fácil de hacer que eso funcione? ¿Hay alguna forma segura de que funcione?

Answer 1

En Angular2 puede usar el enlace de propiedad para acceder a las propiedades de los elementos DOM, en su caso:

<div [innerHTML]="post.body"></div>