title: Aurelia event aggregator VS getter method for two-way data binding
body: <p>I'm new to Aurelia and learning about how to use two-way data binding correctly.</p>
  
  <p>The application I'm working on right now will be composed of multiple sub-apps, each with their own sidebar links (menu) and stuff. The applications can be changed easily at any time using a switcher or the dashboard.</p>
  
  <p>I've noticed that I can't bind an if to a method on the model, as the method doesn't get called periodically:</p>
  
  <pre class="lang-js prettyprint-override"><code>export class App {
      public getMenu() {
          return this.someService.currentApp !== null
              ? this.someService.currentApp.menu
              : [];
      }
  }
  </code></pre>
  
  <pre><code>&lt;div if.bind="getMenu().length &gt; 0"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>The code there is pretty long, so putting it in the template doesn't make sense.</p>
  
  <p>However, if I switch this code to a TS getter instead, everything works great:</p>
  
  <pre class="lang-js prettyprint-override"><code>export class App {
      get menu() {
          return this.someService.currentApp !== null
              ? this.someService.currentApp.menu
              : [];
      }
  }
  </code></pre>
  
  <pre><code>&lt;div if.bind="menu.length &gt; 0"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>However, before I noticed this works, I also tried using the Event Aggregator. I fire an event when the app is changed and subscribe to it on the <code>App</code> ViewModel:</p>
  
  <pre class="lang-js prettyprint-override"><code>export class App {
      public menu: AppMenuLink[];
  
      public constructor(ea: EventAggregator) {
          ea.subscribe('app:changed', (response) =&gt; {
              this.menu = response.app !== null ? response.app.menu : [];
          });
      }
  }
  </code></pre>
  
  <pre><code>&lt;div if.bind="menu.length &gt; 0"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>This method works too (obviously), but I feel like it could make my code too bloated with event subscribers if I abuse it too much in the long run.</p>
  
  <p>So, my question is: Which method is better (and why), or am I missing something completely and doing this all wrong? I'd like to get this clarified before my codebase gets big.</p>
  
  <p>Also (this probably should be another question), while I'm at using the event aggregator, is there a way to let the template know <em>what</em> data to display (when it changes on the event callback), rather than have it check if it changed? I'm thinking this could stop useless checks done by Aurelia to see if the property has changed.</p>