Ändern des Hintergrundbildes auf Modal in Angular2/Ionic2

Question

Ich habe 2 Seiten, eine Homepage, die andere ist modal. Modal hat seinen eigenen Hintergrund, aber wie kann ich Modal Hintergrund ändern, indem ich etwas auf der Homepage klicke?

modal.html

<ion-content> 
something here 
    </ion-content> 

modal.scss

.scroll-content { 
    background-image: url("image.jpg") !important; 
} 

home.html

<div class="circle" (tap)="openModal1($event)"> 
    </div> 

home.ts

tapMiddle(e) { 
    this.openModal1(); 
} 

Also, wenn jemand auf ein Div klickt, soll es das Modal öffnen und den Hintergrund ändern. Wie kann das gemacht werden?

Answer 1

Sie können den Hintergrund dynamisch ändern, indem Sie die style.backgroundImage-Eigenschaft ändern. Sie können die imageUrl nach Belieben auf dem Button Click Event ändern und Sie sollten gut sein.

<div [style.backgroundImage]="'url(' + imageUrl + ')'">