Can't remove element from dictionary

Question

Following my previous question : How get the value of this polymer element ?, I need to remove an element from a dictionary that I pass as an attribute when I import this custom element in another custom element.

flow-element

<script>
Polymer({
  is: 'flow-element',
  properties: {
    dict: {
      type: String,
      notify: true
    },
    name: {
      type: String
    },
    kind: {
      type: String
    }
  },

  handleClick: function() {
    console.log('clicked: ' + this.name);
    // the output does work
    console.log('Dict before ::' + JSON.stringify(this.dict, null, 4));

    // this does NOT work
    delete this.dict[this.name];

    // the output does work, but dictionary is unchanged
    console.log('Dict after ::' + JSON.stringify(this.dict, null, 4));

  }
});
</script>

flow-list

<flow-element dict={{flowDictionnary}} name="{{item.first}}" kind="{{item.last}}"></flow-element>

I am able to access the dictionary (print its content) but for some reason, I can't remove any item from it.

Research

This does work : delete this.dict[0]; (well the element is replace with null)

Before

{
    "first": "Bob",
    "last": "Smith"
}
{
    "first": "Sally",
    "last": "Johnson"
}

After

null,
{
    "first": "Sally",
    "last": "Johnson"
}

However, the list that displayed the dictionary element does not update, and element stay on the screen.

Answer 1

You've tried to use this.splice(path, start, deleteCount)?
You have to use it as follows:
this.splice("dict", index, 1) where index refers to the position of the element to remove. More information about push, pop, splice and other polymer's useful functions here.