{{! pick new delimiters for mustache }}
{{=<% %>=}}
<div class="psdk-page-title">
  <h2>{{ title$ }}</h2>
</div>
<div class="page-body">
  <div *ngFor="let kid of arChildren$">
    <div [ngSwitch]="kid.getPConnect().getComponentName()">
      <component-mapper *ngSwitchCase="'View'" name="View" [props]="{ pConn$: kid.getPConnect() }"></component-mapper>
      <component-mapper *ngSwitchCase="'reference'" name="reference" [props]="{ pConn$: kid.getPConnect() }"></component-mapper>
      <component-mapper *ngSwitchCase="'Region'" name="Region" [props]="{ pConn$: kid.getPConnect() }"></component-mapper>
      <div *ngSwitchDefault><%COMPONENT_CLASS_NAME%> Missing: {{ kid.getPConnect().getComponentName() }}</div>
    </div>
  </div>
</div>
<%={{ }}=%>     {{! revert delimiters for mustache }}