Table header does not hide when column disapears

[fimdomeio]

Table header does not react correctly when hiding collumns. Label stays present

Steps to reproduce

            <md-switch v-model="tableFields.new_code">New Code</md-switch>
(...)

        <md-table-row slot="md-table-row" slot-scope="{ item }">
          <md-table-cell md-label="New Code" md-sort-by="new_code" v-if="tableFields.new_code">{{ item.new_code }}</md-table-cell>
          <md-table-cell md-label="Old Code" md-sort-by="old_code" v-if="tableFields.old_code">{{ item.old_code }}</md-table-cell>
          <md-table-cell md-label="Title" md-sort-by="title" v-if="tableFields.title">{{ item.title }}</md-table-cell>
          <md-table-cell md-label="Materials" md-sort-by="materials" v-if="tableFields.materials">{{ item.materials }}</md-table-cell>
          <md-table-cell md-label="Technic" md-sort-by="technic" v-if="tableFields.technic">{{ item.technic }}</md-table-cell>
          <md-table-cell md-label="Year" md-sort-by="creation_year" v-if="tableFields.creation_year" md-numeric>{{ item.creation_year }}</md-table-cell>
        </md-table-row>

...
  data() {
    return {
      tableFields: {
        new_code: true,
        old_code: false,
        title: true,
        materials: false,
        technic: false,
        creation_year: true,
      },
}

When hiding new_code, content disapears but not the header

Which browser?

I tested in Firefox and Chrome. I think this is not related to a specific browser.

What is expected?

Header column should disapear

Reproduction Link

I could not setup a proper codePen but I'll try again if needed

[fimdomeio]

[VdustR]

Reproduction: https://codepen.io/VdustR/pen/BJpWOq