Search code examples
javascriptaurelia

Force show.bind execution

I have a table with data, and i want view to check show.bind statement when the event is fired from another view. The problem is that the event is not changing any data in the current view.

foo.html: 

 <tr repeat.for="entity of viewData.entities">
  ...
    <p if.bind="$parent.canBeRemoved(entity.id)">
     canBeRemoved
    </p>
 ...
 </tr>

I'm receiving the event with EventAggregator and i want it to force refresh on the array. Is it possible?

Solution

  • Use the signal binding behavior

    The best way to handle this is to send a signal through the signal binding behavior.

    template.html

    <tr repeat.for="entity of viewData.entities">
  ...
  <p if.bind="$parent.canBeRemoved(entity.id) & signal:'update-view'">
    canBeRemoved
  </p>
  ...
</tr>

    viewModel.ts

    import {BindingSignaler} from 'aurelia-templating-resources';

// grab a reference to the signaler
constructor(signaler: BindingSignaler) {
    this.signaler = signaler;
}

// and fire the signal event bound in your view
// whenever the event is handled
respondToEvent(event) {
    // do eventy things
    this.signaler.signal('update-view');
}