@hicoder/angular-cli/templates/widgets/detail/galleryBottomTitle/galleryBottomTitle.component.html

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

<div class="detail" *ngIf="detail">
	<div>
		<%- include('../../../schema-detail.d.actions.html') %>
	</div>
	<div class="d-flex justify-content-center">
		<div class="grid-block" [ngClass]="{'grid-block-large': options['largePicture']}">
			<div class="text-left h-100">
				<div class="grid-fields">
					<%_
				let field0 = detailView[0]; let fn0 = field0.fieldName; let ft0 = field0.type;
				let field1 = detailView[1]; let fn1 = field1.fieldName; let ft1 = field1.type;
				let field2 = detailView[2]; let fn2 = field2.fieldName; let ft2 = field2.type;
				let field, fn, ft, fieldObj;%>
					<div class="grid-head-picture" [ngClass]="{'grid-head-picture-large': options['largePicture']}">
						<lib-mdds-picture-display [downloadUrl]="detail['<%-fn0%>']" [isLarge]="options['largePicture']"
							[style]="{img: {'object-fit': 'contain', width: '100%'}}">
						</lib-mdds-picture-display>
					</div>
					<div *ngIf="!options['notShowTitle']" class="text-center">
						<div class="grid-picture-title"
							[ngClass]="{'grid-picture-title-large': options['largePicture']}">
							<%
							field = field1; fn = fn1; ft = ft1;
							fieldObj = {field, fn, ft, ref_link: true,};
							%>
							<%- include(`/ui/${uiFramework}/${uiDesign}/schema-display.field-wrap.html`, fieldObj); %>
						</div>
						<div class="grid-picture-subtitle"
							[ngClass]="{'grid-picture-subtitle-large': options['largePicture']}">
							<%
							field = field2; fn = fn2; ft = ft2;
							fieldObj = {field, fn, ft, ref_link: true,};
							%>
							<%- include(`/ui/${uiFramework}/${uiDesign}/schema-display.field-wrap.html`, fieldObj); %>
						</div><%if (detailView.length > 3) {%>
						<hr/><%}%><%_
						const otherFields = detailView.slice(3);
						for (let [index, field] of otherFields.entries()){
							if (field.hidden) continue;
					
							let fn = field.fieldName; let ft = field.type;
							let fieldObj = {field, fn, ft, ref_link: true,};

							let fieldHasValue = `fieldHasValue(detail['${fn}'])`;
							if (field.exclusiveRequired) {
							  let values = [];
							  for (let fld of field.formGroup) {
								values.push(`fieldHasValue(detail['${fld.fieldName}'])`);
							  }
							  fieldHasValue = values.join(' || ');
							}
							%>
						<div <%_ if (ft !== 'AngularSelector') {%> *ngIf="<%-fieldHasValue%>"<%}%>
							<% if (field.meta.directive) {
								%><%- include(`/ui/${uiFramework}/schema-display.field.directive.html`, fieldObj); %><%
							  }%>
							class="mx-1 d-flex flex-wrap" [ngStyle]="style['<%-fn%>']"><%_ if (field.showDisplayName) {%>
							<div class="field-label text-right w-50 me-1" [ngStyle]="style['<%-fn%>-label']">
								<%-field.displayName%>:
							</div><%}%>
							<div class="text-left" [ngStyle]="style['<%-fn%>-value']">
								<%- include(`/ui/${uiFramework}/${uiDesign}/schema-display.field-wrap.html`, fieldObj); %>
							</div>
						</div><%_  
						}%>
					</div>
				</div>
			</div>
		</div>
	</div>


	<%- include('../../../schema-detail.d.pipeline.html') %>
	<%- include('../../../schema-detail.d.ref.html') %>
</div>