<hr>
<!-- async examples at the top so can see them in action -->
<hero-message></hero-message>

<hr>
<hero-list></hero-list>

<hr>
<p>The hero's birthday is {{ birthday | date }}</p>

<p>The hero's birthday is {{ birthday | date:"MM/dd/yy" }} </p>

<hr>
<h4>Hero Birthday v.2</h4>
<hero-birthday>loading...</hero-birthday>
<hr>


<p>
    The chained hero's birthday is
    {{ birthday | date | uppercase}}
</p>

<p>
    The chained hero's birthday is
    {{  birthday | date:'fullDate' | uppercase}}
</p>
<p>
    The chained hero's birthday is
    {{ ( birthday | date:'fullDate' ) | uppercase}}
</p>
<hr>
<power-booster>loading...</power-booster>

<hr>
<power-boost-calculator>loading ..</power-boost-calculator>
