Updating DOM on changing value of a variable through Property binding

Ionic Framework ionic-v3
1

I have written a code to change width of ion-items inside an ion-list dynamically on orientation change


if(this.platform.width() < this.platform.height()  && this.isLandscapeMode === true){
      console.log("Portrait Mode");
        this.isLandscapeMode =false;
         this.dynamicWidth=this.platformWidth;
         console.log("Dynamic Width : "+this.dynamicWidth);
          //this.content.resize();
          //location.reload();
         // this.navCtrl.setRoot(this.navCtrl.getActive().component);
    }else if(isLands){
      console.log("Landscape Mode");
        this.isLandscapeMode =true;
        this.dynamicWidth=this.platformHeight;
        console.log("Dynamic Width : "+this.dynamicWidth);
         //this.content.resize();
        // location.reload();
      //  this.navCtrl.setRoot(this.navCtrl.getActive().component);
    }

html
ion-item id="itemFormat" [style.width]=dynamicWidth tappable *ngFor="let item of filteredList" (click)="nodeClick(item)"
"dynamicWidth" being the variable updated in the .ts file whenever the orientation change is detected

Also tried using isLandscape , is Portrait
I dont want to explicitely goand load the page, Using ngStyle should do it autoatically , but its not happening.

2

(I changed your post to format your code or error message correctly. Please use the </> button above the post input field to format your code or error message or wrap it in ``` (“code fences”) manually. This will make sure your text is readable and if it recognizes the programming language it also automatically adds code syntax highlighting. Thanks.)

3

I was able to resolve the issue by using Zone for change detection