@hicoder/angular-cli
Version:
Angular UI componenets and service generator. It works with the mean-rest-express package to generate the end to end web application. The input to this generator is the Mongoose schema defined for the express application. mean-rest-express exposes the Res
136 lines (134 loc) • 9.05 kB
HTML
<%_let fieldValue = `detail['${fn}']`;
if (field.meta.pipe) {
let pipeSelector = selectors[field.meta.pipe].selector;
fieldValue += ` | ${pipeSelector}`;
let pipeInputs = selectors[field.meta.pipe].inputs || [];
for (let inputObj of pipeInputs) {
const value = inputObj.value;
switch (typeof value) {
case 'string':
fieldValue += `:'${value}'`;
break;
case 'number':
case 'boolean':
fieldValue += `:${value}`;
break;
default:
console.error(`Pipe input type ${typeof value} is not supported.`);
}
}
}
%><%_if(ft == 'ObjectId') {
if (typeof ref_link === 'undefined') ref_link = true;
let ref_l = false;
if (refApi[field.ref] && refApi[field.ref].includes("R") && ref_link) {ref_l = true;}%>
<%if (ref_l){%><a routerLink="." (click)="onDisplayRefClicked('<%-fn%>', detail['<%-fn%>'], $event)"><%_}%>
{{detail['<%-fn%>']?detail['<%-fn%>']['valueMedium']:""}}
<%if (ref_l){%></a><%_}%><%_
} else if (ft === 'SchemaDate') {
let fmraT = field.mraType;
%> {{detail['<%-fn%>']? (detail['<%-fn%>']['value'] | date:'<%-fmraT%>') : ''}}<%_
} else if (ft === 'SchemaArray') {
if (field.elementMultiSelect) {%>
<div class="badge rounded-pill bg-secondary" *ngFor="let element of enums['<%-fn%>']">
<div *ngIf="detail['<%-fn%>'] && detail['<%-fn%>']['selection'][element]">{{element}}</div>
</div><%
} else if (field.elementType === 'SchemaString' && field.picture) {%>
<div class="d-flex align-items-center" *ngIf="detail['<%-fn%>'] && detail['<%-fn%>']['selection']">
<div class="picture-small-block" *ngFor="let element of detail['<%-fn%>']['selection']; let i = index;">
<lib-mdds-picture-display [downloadUrl]="element" [isLarge]="false"
[style]="{img: {'background-color': '#8080801f', 'object-fit': 'contain', width: '100%'}}">
</lib-mdds-picture-display>
</div>
</div><%
} else if (field.elementType === 'SchemaString' && field.file) {%>
<div class="" *ngIf="detail['<%-fn%>'] && detail['<%-fn%>']['selection']">
<lib-mdds-files-display [downloadUrls]="detail['<%-fn%>']['selection']">
</lib-mdds-files-display>
</div><%
} else if (field.elementType === 'SchemaString' && field.mraType === 'httpurl') {%>
<div *ngIf="detail['<%-fn%>'] && detail['<%-fn%>']['selection']">
<ng-template ngFor let-element [ngForOf]="detail['<%-fn%>']['selection']" let-idx="index">
<div class="badge rounded-pill bg-light">
<a href="{{element['url']}}">{{element['display'] || element['url']}}</a>
</div>
</ng-template>
</div><%
} else if (field.elementType === 'SchemaString' && field.mraType === 'email') {%>
<div *ngIf="detail['<%-fn%>'] && detail['<%-fn%>']['selection']">
<ng-template ngFor let-element [ngForOf]="detail['<%-fn%>']['selection']" let-idx="index">
<div class="badge rounded-pill bg-light">
<a href="mailto:{{element}}">{{element}}</a>
</div>
</ng-template>
</div><%
} else if (field.elementType === 'SchemaString') {%>
<div *ngIf="detail['<%-fn%>'] && detail['<%-fn%>']['selection']">
<ng-template ngFor let-element [ngForOf]="detail['<%-fn%>']['selection']" let-idx="index">
<div class="badge rounded-pill bg-secondary">
{{element}}
</div>
</ng-template>
</div><%
} else if (field.elementType === 'ObjectId') {%>
<div *ngIf="detail['<%-fn%>'] && detail['<%-fn%>']['selection']">
<ng-template ngFor let-element [ngForOf]="detail['<%-fn%>']['selection']" let-idx="index">
<div class="badge rounded-pill bg-light">
<a class="pointer" (click)="onDisplayRefClicked('<%-fn%>', detail['<%-fn%>']['selection'][idx], $event)">
{{element.valueMedium}}
</a>
</div>
</ng-template>
</div><%}%><%
} else if (ft === 'Map') {
if (field.elementType === 'SchemaString') {%>
<div *ngIf="detail['<%-fn%>'] && detail['<%-fn%>']['selection']">
<ng-template ngFor let-element [ngForOf]="objectKeys(detail['<%-fn%>']['selection'])" let-idx="index">
<div class="d-flex flex-wrap">
<div class="me-2">{{element}}:</div>
<div>{{detail['<%-fn%>']['selection'][element]}}</div>
</div>
</ng-template>
</div><%} else if (field.elementType === 'SchemaNumber') {%>
<div *ngIf="detail['<%-fn%>'] && detail['<%-fn%>']['selection']">
<ng-template ngFor let-element [ngForOf]="objectKeys(detail['<%-fn%>']['selection'])" let-idx="index">
<div class="d-flex flex-wrap">
<div class="me-2">{{element}}:</div>
<div>{{detail['<%-fn%>']['selection'][element] <%if (field.mraType === 'currency') {%>| currency:'USD'<%}%> }}</div>
</div>
</ng-template>
</div><%}%><%
} else if (ft === 'SchemaString') {
if (field.editor) {%>
<div libMddsRichtextShow="<%-schemaName%>Detail<%-field.FieldName%>" [content]="detail['<%-fn%>']"></div><%
} else if (field.picture) {
let isLarge;
if (typeof largePicture === 'undefined') isLarge = false;
else isLarge = largePicture;%>
<lib-mdds-picture-display [downloadUrl]="detail['<%-fn%>']" [isLarge]="<%-isLarge%>" [aspectRatio]="<%-field.aspectRatio%>"></lib-mdds-picture-display><%
} else if (field.file) {%>
<lib-mdds-files-display [downloadUrls]="[detail['<%-fn%>']]"></lib-mdds-files-display><%
} else if (field.textarea) {%>
<div [innerHTML]="detail['<%-fn%>']"></div><%
} else if (field.meta.innerHtml) {%>
<div [innerHTML]="<%-fieldValue%>"></div><%
} else if (field.mraType === 'httpurl') {%>
<a href="{{detail['<%-fn%>']['url']}}" target="_blank">{{detail['<%-fn%>']['display'] || detail['<%-fn%>']['url']}}</a><%
} else if (field.mraType === 'email') {%>
<a href="mailto:{{detail['<%-fn%>']}}">{{detail['<%-fn%>']}}</a><%
} else {%>
{{<%-fieldValue%>}}<%_
}%><%
} else if (ft === 'SchemaNumber') {
if (field.mraType === 'currency') {%>
{{ detail['<%-fn%>'] | currency:'USD'}}<%
} else {%>
{{<%-fieldValue%>}}<%_
}%><%
} else if (ft === 'AngularSelector') { let sel = field.selector;%>
<<%-sel.selector%><% for(let input of sel.inputs) {%>
[<%-input.key%>]="<%-input.value%>"<%}%><% for(let output of sel.outputs) {%>
(<%-output.key%>)="<%-output.value%>"<%}%>
>
</<%-sel.selector%>><%
} else {%>{{<%-fieldValue%>}} <%}%>