title: Angular JS - Number filter - Change colour when negative
body: <p>I am applying a number filter to the result of a function:</p>
  
  <pre><code>&lt;tr class="text-center"&gt;
      &lt;th class="text-center"&gt;{{monthCategoryTotalPredict = getCategoryMonthTotal(costDirection, month, category, "predict")  | currency:currencySymbol}}&lt;/th&gt;
      &lt;th class="text-center"&gt;{{monthCategoryTotalActual  = getCategoryMonthTotal(costDirection, month, category, "actual")   | currency:currencySymbol}}&lt;/th&gt;
      &lt;th class="text-center"&gt;{{calculateSurplus(monthCategoryTotalPredict, monthCategoryTotalActual)  | currency:currencySymbol}}&lt;/th&gt;
  &lt;/tr&gt;
  </code></pre>
  
  <p>Negative numbers are represented like this by default: (£230.00).</p>
  
  <p>My aim is to make them also change colour to red. How can I do this in Angular JS? Can this be part of the filter? Can I override the filter to modify it's default behaviour slightly without a complete rewrite?</p>
  
  <p>Thanks in advance!</p>