How to apply conditional column offsets in IONIC 3

Question

I am using the ionic 3 and i have created grids.

<ion-row>
<ion-col col-4 offset-4>

</ion-col>
</ion-row>

And Now i want to apply conditions on columns offset for this i have applied this code given below, but i got the error.

<ion-row>
<ion-col col-4 offset-{{(variable == 1)?'4':'0'}}>

</ion-col>
</ion-row>

If anyone has suggestions so plz help me Thanks

Answer 1

You can't bind value to offset, i think you should try this, first make a variable in your ts file for example offsetVariable = true then in your HTML file

<ion-row>
  <ion-col col-4 offset-4 *ngIf="offsetVariable">

  </ion-col>
</ion-row>

and

<ion-row>
    <ion-col col-4 offset-0 *ngIf="!offsetVariable">
    
    </ion-col>
</ion-row>

Answer 2

Below works in Ionic 5

<ion-row>
  <ion-col col-4 [offset]="offsetVariable ? 4 : 0">

  </ion-col>
</ion-row>