<template v-for... not working on IE 10 & 11 on 'table' tag. Woking on other browsers, including IE 9

Vue.js version

1.0.24

Reproduction Link

JSFiddle

Steps to reproduce

Run JSFiddle using IE 10/11

What is Expected?

<template v-for= is working correctly for tables in IE 10/11

What is actually happening?

IE 10/11 is not rendering table correctly. Other browsers, including IE 9 works correctly. This bug is only reproducable for “table” tag rendering. When <template... is used on lists etc. it works correctly.

[Aymkdn]

It took me a while to find the correct use of is. So I share it here:

<table>
  <tbody>
    <tr is="itemtpl" v-for="item in items" :item="item"></tr>
  </tbody>
</table>
[...]
<script type="text/x-template" id="itemtpl-template">
  <tr>
    <td>{{ item.id }}</td>
    <td>{{ item.name }}</td>
  </tr>
</script>

[KongenChen]

If you just want to loop once, you can

<table>
    <thead>
        <tr>
            <th>header1</th>
            <th>header2</th>
        </tr>
    </thead>
    <tbody>
        <tr v-for="item in items">
            <td>{{item.real_name}}</td>
            <td>{{item.department_name}}</td>
        </tr>
    </tbody>
</table>

If you want to loop twice, I have a trick for that though it will produce many tbody elements. But it seems that it display correctly.

<table>
    <thead>
        <tr>
            <th>header1</th>
            <th>header2</th>
        </tr>
    </thead>
    <tbody v-for="item in items">
        <tr v-for="value in item">
            <td>{{value.value_name}}</td>
            <td>{{value.value_type}}</td>
        </tr>
    </tbody>
</table>