permite ver fotos de la galería en grande

src/app/perfil-discoteca/perfil-discoteca.page.html

@@ -13,8 +13,9 @@
     </ion-toolbar>
   </ion-header>
 
-  <ion-grid>
+  
     <div class='fotoPerfil'>
+      <ion-grid>
       <ion-row>
         <ion-col>
           <ion-img class="fotoPerfil" width="100%" height="100%" [src]='fotoSrc' alt='barraquinha'></ion-img>
@@ -55,17 +56,20 @@
             <div [contentEditable]='editEnabled'>{{localizacion}}</div>
           </div>
         </ion-col>
+
         <ion-col>
           <div class="galeria">
             Galería de Fotos
             <input type="file" (change)="loadImageFromDevice($event)" id="file-input-galeria" accept="image/png, image/jpeg">
-            <ion-slides (ionDrag)="onSlideChanged()">
+            <ion-slides (ionDrag)="onSlideChanged()" [options]="sliderOpts">
               <ion-slide *ngFor="let foto of galeriaFotos">
-                <div class="fotoGaleria"><img src="{{foto}}">
-                <ion-button (click)="borrarDeGaleria()">
-                  <ion-icon name="trash-outline"></ion-icon>
-                </ion-button>
-              </div>
+                <div class="fotoGaleria"><img src="{{foto}}" tappable (click)="openPreview(foto)">
+                  <div class="botonesHidden"  id="botonesHidden3">
+                    <ion-button (click)="borrarDeGaleria()">
+                      <ion-icon name="trash-outline"></ion-icon>
+                    </ion-button>
+                  </div>
+                </div>
               </ion-slide>
             </ion-slides>
           </div>
@@ -91,7 +95,8 @@
                 <ion-icon name="calendar-outline"></ion-icon>
                 {{evento.fecha}} · 
                 <ion-icon name="cash-outline"></ion-icon>
-                {{evento.precio1}}, {{evento.precio2}}
+                {{evento.precio1}},{{evento.precio2}}
+                <ion-button (click)="editarEvento(evento);$event.stopPropagation();"><ion-icon name="pencil-outline"></ion-icon></ion-button>
                 </div>
                 <div class="eventoDesc">
                 {{evento.descripcion}}
@@ -101,13 +106,13 @@
           </ion-list>
         </div>
       </ion-row>
-      
+    </ion-grid>  
     </div>
 
   
 
 
 
-  </ion-grid>
+
 
 </ion-content>

src/app/perfil-discoteca/perfil-discoteca.page.ts

@@ -1,13 +1,13 @@
 import { Component, OnInit } from '@angular/core';
-import { NodeCompatibleEventEmitter } from 'rxjs/internal/observable/fromEvent';
-import { Tab1Service } from '../tab1/tab1.service'
-import { Discoteca } from '../discoteca'
-import { IonSlides} from '@ionic/angular';
+import { Tab1Service } from '../tab1/tab1.service';
+import { IonSlides, ModalController} from '@ionic/angular';
 import { AlertController } from '@ionic/angular';
 import { ViewChild } from '@angular/core';
 import { Evento } from '../evento';
 import { Router } from '@angular/router';
 import { THIS_EXPR } from '@angular/compiler/src/output/output_ast';
+import { GaleriamodalPage } from '../galeriamodal/galeriamodal.page';
+import { stringify } from '@angular/compiler/src/util';
 
 @Component({
   selector: 'app-perfil-discoteca',
@@ -29,8 +29,13 @@ export class PerfilDiscotecaPage implements OnInit {
   currentIndex: number;
   eventos: Evento[];
   alertCtrl: AlertController;
+  sliderOpts = {
+      slidesPerView: 1.5,
+      centeredSlides: true,
+      spaceBetween: 20,
+  };
 
-  constructor(private tab1Service: Tab1Service, private router: Router) {
+  constructor(private tab1Service: Tab1Service, private router: Router, private modalController: ModalController) {
 
   }
 
@@ -45,9 +50,9 @@ export class PerfilDiscotecaPage implements OnInit {
     this.getEventos();
     this.editDisabled="true";
     this.editEnabled="false";
-    this.fotoSrc = '../assets/barraca.jpg';
+    this.fotoSrc = '../assets/img/barraca.jpg';
     this.fotoLoaded = this.fotoSrc;
-    this.galeriaFotos = [];
+    this.galeriaFotos = this.tab1Service.galeria;
 
   }
 
@@ -73,8 +78,9 @@ export class PerfilDiscotecaPage implements OnInit {
   }
 
   addGaleria(){
-     this.galeriaFotos.push(this.someURL); 
-     this.slides.update();
+    this.tab1Service.galeria.push(this.someURL);
+    this.galeriaFotos = this.tab1Service.galeria;
+    this.slides.update();
 
 
   }
@@ -158,14 +164,30 @@ export class PerfilDiscotecaPage implements OnInit {
     this.slides.update();
 } 
 
-addEvento() {
-  this.router.navigate(['/tabs/tab1/prompt-evento']);
+  addEvento() {
+    this.tab1Service.editarEvento=false;
+    this.router.navigate(['/tabs/tab1/prompt-evento']);
 }
 
-mostrarEvento(evento: Evento){
-  this.tab1Service.eventoIndex = this.eventos.indexOf(evento);
-  this.router.navigate(['/tabs/tab1/view-evento']);
+  mostrarEvento(evento: Evento){
+    this.tab1Service.eventoIndex = this.eventos.indexOf(evento);
+    this.router.navigate(['/tabs/tab1/view-evento']);
 }
+
+  editarEvento(evento: Evento){
+    this.tab1Service.eventoIndex = this.eventos.indexOf(evento);
+    this.tab1Service.editarEvento = true;
+    this.router.navigate(['/tabs/tab1/prompt-evento']);
+}
+
+  openPreview(foto: string){
+      this.modalController.create({
+        component: GaleriamodalPage,
+        componentProps: {
+          foto: foto
+        }
+      }).then(modal=>modal.present());
+  }
 }