Class Binding ternary operator : <p>I have some rather cumbersome logic I would like to apply to an element class.</p>

<pre><code>:class="{sportTypes.sports.indexOf(sport) &gt; -1 ? 'is-primary' : 'is-outlined'}"
</code></pre>

<p>The above doesn't work, while the following does:</p>

<pre><code>:class="{'is-outlined': sportTypes.sports.indexOf(sport) &gt; -1}"
</code></pre>

<p>I get the following error</p>

<pre><code>template syntax error - invalid expression:
</code></pre>

<p>Any ideas what's wrong with the first part?</p>
