Making Div visible after specyfic action

Ionic Framework ionic-v3
1

Hi,
I have got div, thats visibility is set to “hidden”

html:

 <div class="sroda">
 <button (click)="skip()" id="skip">
  {{skipMsg}}
</button>
</div>

scss:

.sroda{
position: absolute;
z-index: 1;
width:89%;
text-align: center;
visibility: hidden;
}

skipMsg is changing when slides ends

html:

<ion-slides pager (ionSlideDidChange)="slideChanged()" (ionSlideDrag)="slideMoved()">

ts:

skipMsg: string = "Skip";
 slideChanged() {
    if (this.slides.isEnd())
      this.skipMsg = "Changed";
  }

How can I use slideChanged() to change div visibility to visible?

2

Do you need to have the div rendered invisible?

You can use *ngIf=" theCondition " on your div.

1 Like
3

Or [hidden]=“shouldHide”>