Displaying raw HTML and non html content in same column

I wanted to display raw HTML with v-html and normal text element in the same row. When using the template slot it does not display the html element, when using the <span> it only display the html.

Is there any workaround for this?

What i wanted to achieve is.

<template>
  <div>
    <b-table :fields="fields" :items="items">
      <span slot="html" slot-scope="data" v-html="data.value"></span>
    </b-table>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        fields: ["html"],
        items: [
          {
            text: 'This is <i>escaped</i> content',
            html: 'This is <i>notice for student</i>',
            created_at: '4/30/2019'
          }
        ]
      }
    }
  }
</script>

[aakashbashyal21]

Worked perfectly, learned complete new thing today. Thank you.

[tmorehouse]

https://jsfiddle.net/5epw30of/