renuo/ngx-renuo-upload

<div class="container">
  <h1><code>ru-gallery</code></h1>
  <div *ngIf="alertList">
    <div *ngFor="let alert of alertList" class="alert alert-danger alert-dismissable">
      <a class="close" (click)="removeAlert(alert)" aria-label="close">&times;</a>
      {{i18n.interpolate(i18n.t.upload.error[alert.messageType], {fileName: alert.file.name})}}
    </div>
  </div>

  <h3>{{i18n.t.home.fillGallery}}</h3>
  <ru-custom-image-multi-upload
    maxFilesAllowed="8"
    acceptedFiles="image/jpeg, image/png"
    (onFileUpload)="updatePictures($event)"
    (onError)="addAlert($event)"></ru-custom-image-multi-upload>
  <hr>

  <code><pre>
&lt;ru-gallery [images]="pictures"
    quality="10"
    roundedCorners="60" background="10,10,255"
    showPreview="0"
    spacing="10"
    thumbnailDimensions="250x250"
    watermark="https://www.renuo.ch/images/logo.png"&gt;
&lt;/ru-gallery&gt;
  </pre>
  </code>

  <h2>{{i18n.t.home.simpleUse}}</h2>
  <ru-gallery [images]="pictures" [showPreview]="false" spacing="10"
              roundedCorners="15"
              thumbnailDimensions="300x200"></ru-gallery>
  <h2>{{i18n.t.home.advancedUse}}</h2>
  <br>
</div>
<div class="gallery">
  <ru-gallery [images]="pictures" spacing="1"></ru-gallery>
</div>