How to Remove a Polymer paper-listbox Item in an AngularDart Component

Question

I generate a paper-listbox as follows:

  <paper-listbox  class="scroll-list gutter" id="index">
    <paper-item class="index-entry" *ngFor="let composition of compositions" [class.selected]="composition == selectedComposition" (click)="onSelect(composition)">
      {{ composition.name }}
    </paper-item>
  </paper-listbox>

I have a method that deletes an item from the database. I want to remove the corresponding entry from the list as well. I found this stackoverflow question and tried it. It gave a no such method error when I ran it. Then I tried:

PaperListbox index;
...
index = querySelector('#index');
...
index.remove();

It removes the entire listbox. I was in the ball park so I tried:

index.selectedItem().remove();

That gave me the browser console error:

ORIGINAL EXCEPTION: Class 'PaperItem' has no instance method 'call'.

NoSuchMethodError: method not found: 'call'
Receiver: Instance of 'PaperItem'
Arguments: []

Given that the error mentions paper-item makes me think I'm getting close, but I'm out of ideas. How does one delete a paper-listbox item? For extra credit, how does one add an item? That's my next task.

Answer 1

Just remove the item from composition and *ngFor updates the list of <paper-item ...> entries automatically.