Docs for m2-core, m2-components
  1. Components
  2. ImageSelectorComponent

File

projects/m2-core/src/lib/shared/ui-components/image/image-selector.component.ts

Metadata

selector image-selector
styles .image-value { margin: 0; box-shadow: 0 0 10px; color: rgba(0,0,0,0.45); /* box-shadow with unspecified color defaults to standard color property */ } .image-value.focused { color: rgba(210, 71, 29, 0.8); } .img-tools { left: 105%; right: auto; } .image-container:hover .img-tools { display: block; }
template 
<div class="sdi-card-wrapper image-container"
     [title]="isImagePasteFocused ? 'Нажмите Ctrl+V, чтобы вставить изображение' : ''"
     (click)="sdiPaste.focusTarget()">
    <div class="image-value" [class.focused]="isImagePasteFocused">
        <span class="centerer"></span>
        <img class="image-thumbnail" [src]="src" (click)="onImageClick($event)">

        <div class="img-tools">
            <i class="fa fa-fw fa-folder-open sdi-icon" (click)="onSelectImageClick($event)"
                    i18n-title="@@uploadImgTitle" title="Загрузить изображение">
            </i>
            <!--<i *ngIf="isImageSet" class="fa fa-fw fa-times sdi-icon" (click)="onDeleteImageClick($event)" i18n-title="@@deleteImgTitle" title="Удалить изображение"></i>-->
        </div>
    </div>
</div>

<sdi-paste #sdiPaste (focused)="isImagePasteFocused = true" (blurred)="isImagePasteFocused = false"
           (pasted)="onImagePasted($event)"></sdi-paste>

Index

Properties
Methods
Inputs
Accessors

Constructor

constructor(imageService: ImageService, globalModalsService: GlobalModalsService)
Parameters :
Name Type Optional
imageService ImageService No
globalModalsService GlobalModalsService No

Inputs

editImageFn
Type : function
imgSrc
Type : string

Methods

onImageClick
onImageClick(event: MouseEvent)
Parameters :
Name Type Optional
event MouseEvent No
Returns : void
onImagePasted
onImagePasted(clipboardData: DataTransfer)
Parameters :
Name Type Optional
clipboardData DataTransfer No
Returns : void
onSelectImageClick
onSelectImageClick(event: MouseEvent)
Parameters :
Name Type Optional
event MouseEvent No
Returns : void

Properties

isImagePasteFocused
Type : boolean

Accessors

isImageSet
getisImageSet()
src
getsrc()
Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""