@WidgetComponent
File
Implements
Metadata
| selector |
nm-edit-footer-textgen-popup.component |
| templateUrl |
./edit-footer-textgen-popup.component.html |
Index
Widget inputs
|
|
|
Widget outputs
|
|
|
Properties
|
|
|
Methods
|
|
|
|
config
|
config: any
|
Type : any
|
Default value : {
pagination: {
el: ".swiper-pagination",
},
paginationClickable: true,
navigation: {
nextEl: ".swiper-button-next",
prevEl: ".swiper-button-prev",
},
spaceBetween: 30,
}
|
|
|
|
Public
previews
|
previews: any
|
Type : any
|
Default value : []
|
|
|
|
usefulSwiper
|
usefulSwiper: SwiperComponent
|
Type : SwiperComponent
|
Decorators : ViewChild
|
|
|
import { Component, OnInit, Inject, ViewChild } from "@angular/core";
import { MatDialogRef, MAT_DIALOG_DATA } from "@angular/material/dialog";
import { SwiperComponent } from "ngx-useful-swiper";
@Component({
selector: "nm-edit-footer-textgen-popup.component",
templateUrl: "./edit-footer-textgen-popup.component.html",
})
export class EditFooterTextgenPopupComponent implements OnInit {
@ViewChild(SwiperComponent, { static: true }) usefulSwiper: SwiperComponent;
public title: string;
public message: string;
public previews: any = [];
config: any = {
pagination: {
el: ".swiper-pagination",
},
paginationClickable: true,
navigation: {
nextEl: ".swiper-button-next",
prevEl: ".swiper-button-prev",
},
spaceBetween: 30,
};
constructor(
@Inject(MAT_DIALOG_DATA) private data: any,
public dialogRef: MatDialogRef<EditFooterTextgenPopupComponent>
) {}
next() {
this.usefulSwiper.swiper.slideNext();
}
prev() {
this.usefulSwiper.swiper.slidePrev();
}
ngOnInit() {
this.previews = this.data.previews;
}
}
<nm-dialog [dialogRef]="dialogRef" class="nm-dialog nm-textgen">
<ng-container slot="title">
{{ "app.ipim-my-texter.webtextfor" | translate }}
{{ "app.ipim-my-texter.placeholder.product" | translate }}
{{ previews[0]?.productNo }}
</ng-container>
<ng-container slot="content">
<igx-carousel #carousel>
<igx-slide *ngFor="let preview of previews">
<div
class="swiper-slide"
[ngClass]="{ 'nm-space-for-buttons': previews.length > 1 }"
>
<div
class="nm-attribute-list-elements"
*ngIf="preview?.itemNo != null"
>
<div class="nm-attribute-list-description">
{{ "app.ipim-my-texter.placeholder.articelno" | translate }}
</div>
<div class="nm-attribute-list-value">{{ preview?.itemNo }}</div>
</div>
<div
class="nm-attribute-list-elements"
*ngIf="preview?.description != null"
>
<div class="nm-attribute-list-description">
{{ "app.ipim-my-texter.placeholder.description" | translate }}
</div>
<div class="nm-attribute-list-value">
{{ preview?.description }}
</div>
</div>
<div
class="nm-attribute-list-elements"
*ngIf="preview?.language != null"
>
<div class="nm-attribute-list-description">
{{ "app.ipim-my-texter.placeholder.language" | translate }}
</div>
<div class="nm-attribute-list-value">
{{ preview?.language | translate }}
</div>
</div>
<div
class="nm-attribute-list-elements"
*ngIf="preview?.preview != null"
>
<div class="nm-attribute-list-description">Web-Text</div>
<div class="nm-attribute-list-value">
<pre
style="
max-height: 180px;
overflow: auto;
white-space: pre-wrap;
white-space: -moz-pre-wrap;
white-space: -pre-wrap;
white-space: -o-pre-wrap;
word-wrap: break-word;
word-break: normal;
text-align: left;
"
>{{ preview?.preview }}</pre
>
</div>
</div>
</div>
</igx-slide>
</igx-carousel>
<div
class="upload-button-container"
style="position: relative; z-index: 1000"
></div>
</ng-container>
<ng-container slot="actions">
<button mat-button type="button" (click)="dialogRef.close(true)">
{{ "button.close" | translate }}
</button>
</ng-container>
</nm-dialog>
Legend
Html element with directive