HTML Tag in Array Value

Question

The Requirement is to append an HTML element from Array Value to DOM

template: {
    0: {
       h1: '<h1>Hi</h1>'
    },
    1: {
       h2: '<h2>Hi</h2>'
    },
    2: {
       h3: '<h3>Hi</h3>'
    }
}

I have a VueJS For Loop:

        <div v-for="temp in template">
            {{ temp.h1}}
        </div>

DOM :

<h1>hi</h1>

You need to elaborate more on your problem. What are you actually trying to achieve? — Dan Gamble
– Dan Gamble, Commented Sep 13, 2017 at 10:19

tony19 · Accepted Answer · 2022-07-15 01:30:28Z

1

I think you need to use v-html binding to inject raw html in page.

Something like this:

<div v-for="temp in template">
    <div v-html="temp.h1">
</div>

tony19

140k24 gold badges281 silver badges354 bronze badges

answered Sep 13, 2017 at 10:22

Frix33

1,24110 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

1 Answer 1