<!--#docregion-->
<!--#docregion i18n-attribute-meaning-->
<h1 i18n="User welcome|An introduction header for this sample@@introductionHeader">
  Hello i18n!
</h1>
<!--#enddocregion i18n-attribute-meaning-->

<!--#docregion i18n-ng-container-->
<ng-container i18n>I don't output any element</ng-container>
<!--#enddocregion i18n-ng-container-->

<br />

<!--#docregion i18n-title-translate-->
<img [src]="logo" i18n-title title="Angular logo" />
<!--#enddocregion i18n-title-translate-->
<br>
<button (click)="inc(1)">+</button> <button (click)="inc(-1)">-</button>
<!--#docregion i18n-plural-->
<span i18n>{wolves, plural, =0 {no wolves} =1 {one wolf} =2 {two wolves} other {a wolf pack}}</span>
<!--#enddocregion i18n-plural-->
({{wolves}})
<br><br>
<button (click)="male()">&#9794;</button> <button (click)="female()">&#9792;</button>
<!--#docregion i18n-select-->
<span i18n>The hero is {gender, select, m {male} f {female}}</span>
<!--#enddocregion i18n-select-->
<br><br>
<!--#docregion i18n-nested-->
<span i18n>Here we have: {count, plural,
  =0 {no one}
  =1 {one {gender, select, male {man} female {woman}}}
  other {{{heroes.length}} {gender, select, male {men} female {women}}}
}</span>
<!--#enddocregion i18n-nested-->
