P3X GitList

<div style="margin-top: 8px; margin-bottom: 18px; max-width: 700px; margin-left: auto; margin-right: auto; padding-left: 10px; padding-right: 10px;">
    <mat-toolbar color="primary">
        P3X Angular Compile v{{ version }}
    </mat-toolbar>
    <mat-card appearance="outlined" style="border-radius: 0; padding: 10px;">




        <a mat-button mat-stroked-button color="primary" target="_blank" class="mat-headline-6" href="https://corifeus.com/angular-compile">Corifeus.com Wiki</a>
        <br/>
        <br/>
        <a mat-button mat-stroked-button color="primary" target="_blank" href="https://github.com/patrikx3/angular-compile/blob/master/src/app/app.component.ts">How it works from the code in GitHub, some examples</a>

        <br/>
        <br/>
        <strong>Go ahead and inspect the elements and click away!!!</strong>

        <br/>
        <br/>
        <mat-divider></mat-divider>
        <br/>

        <div class="mat-h1">Template 1</div>
        <div [p3x-compile]="data1" [p3x-compile-ctx]="this" [p3x-compile-module]="dataMaterialModule" class="p3x-angular-compile-element"></div>

        <br/>
        <mat-divider></mat-divider>
        <br/>

        <div class="mat-h1">Template 2</div>
        <div [p3x-compile]="data2" [p3x-compile-ctx]="this" [p3x-compile-module]="dataMaterialModule" class="p3x-angular-compile-element"></div>

        <br/>
        <mat-divider></mat-divider>
        <br/>
        <div class="mat-h1">Template 3</div>
        <div [p3x-compile]="data3" [p3x-compile-ctx]="this" [p3x-compile-module]="dataMaterialModule" class="p3x-angular-compile-element"></div>

        <br/>
        <mat-divider></mat-divider>
        <br/>
        <div class="mat-h1">Template 4 - Re-use the same context</div>
        <div *ngIf="true" [p3x-compile]="data2" [p3x-compile-ctx]="this" [p3x-compile-module]="dataMaterialModule" class="p3x-angular-compile-element"></div>


        <br/>
        <br/>
        <mat-divider></mat-divider>
        <br/>

        <div class="mat-h1">Pure Router Link with JIT Angular</div>
        <button mat-button mat-flat-button color="accent" (click)="randomRouterLinkPure()">Generate new router link</button>
        &nbsp;
        <span [p3x-compile]="dataRouterLink" [p3x-compile-ctx]="this" [p3x-compile-module]="dataMaterialModule" class="p3x-angular-compile-element"></span>

        <br/>
        <br/>
        <mat-divider></mat-divider>
        <br/>

        <div class="mat-h1">Router Link with p3x-angular-compile</div>
        <div [p3x-compile]="dataMaterial" [p3x-compile-ctx]="this" [p3x-compile-module]="dataMaterialModule" class="p3x-angular-compile-element"></div>

    </mat-card>

</div>