CODEWITHSUNDEEP
htmltemplatesbuttonionic-frameworkng-show
Unknown123
Unknown123

Reputation: 228

Using ng-show in ionic template

I need to show a corresponding button to my string value in JSON. I tried to use ng-show but I see every button on my site.

<ion-col ng-show="channels.fields.status == 'on'" col-sm-1 class="verse">
    <button ion-button color="secondary" class="big_on"> On </button>
</ion-col>

<ion-col ng-show="channels.fields.status == 'off'" col-sm-1 class="verse">
     <button ion-button color="light" class="big_off"> Off </button> 
</ion-col>
<ion-col ng-show="channels.fields.status == 'error'" col-sm-1 class="verse"> 
     <button ion-button color="danger" class="big_error"> Error </button> 
</ion-col>

Upvotes: 3

Views: 588

Answers (2)

Rajat
Rajat

Reputation: 692

I haven't used ionic 2 but as far as I know, "ion-col" is part of ionic 2 which uses Angular2.

Try using *ngIf instead of ng-show. For example:

<ion-col *ngIf="channels.fields.status == 'on'" col-sm-1 class="verse <button ion-button color="secondary" class="big_on">On</button></ion-col>

Upvotes: 0

Santhoshkumar
Santhoshkumar

Reputation: 780

Change ng-show to ng-if

Try Following code,

  <ion-col ng-if="channels.fields.status == 'on'" col-sm-1 class="verse"><button ion-button color="secondary" class="big_on">On</button></ion-col>
  <ion-col ng-if="channels.fields.status == 'off'" col-sm-1 class="verse"> <button ion-button color="light" class="big_off">Off</button> </ion-col>
  <ion-col ng-if="channels.fields.status == 'error'" col-sm-1 class="verse"> <button ion-button color="danger" class="big_error">Error</button> </ion-col>

Upvotes: 2

Related Questions