Значение Ionic Storage не будет отображаться в HTML, пока страница не будет перезагружена.

В вашем файле .ts сделайте это,

import {
    ActivatedRoute
} from '@angular/router';
import {
    Storage
} from '@ionic/storage';
import {
    ChangeDetectorRef
} from '@angular/core';


export class SummaryComponent implements OnInit, OnDestroy {

    //My Variables
    routeParams;
    data2;
    _idx;

    constructor(
        private route: ActivatedRoute,
        private storage: Storage,
        private changeRef: ChangeDectetorRef
    ) {}

    ngOnInit() {
        this.routePrams = this.route.params.subscribe(params => /** ... do whatever you need to do in here that involves params **/);

        this._idx = Temperature.__idx;                                                    
        this.storage.get(this._idx).then(data=>{
          //if data exists
          if(data)
            {
             console.log("data read");
             this.data2 = data;
             console.log(data);
            }
            else
            {
              console.log("data is empty");
              this.data2 = [];
            }
            this.changeRef.detectChanges();
        });
    }

    ngOnDestroy() {
        this.routeParams.unsubscribe();
    }

}

Объяснение: я не знаю, почему вы используете storage.ready(), в этом нет необходимости. Я не знаю, почему вы делаете вызов хранилища внутри наблюдаемого, который никогда не используется в вызове хранилища; разделите их (если вы не используете переменную param). Вам необходимо отказаться от подписки на каждую сделанную вами подписку; сделайте это, иначе вы рискуете утечкой памяти на стороне клиента.

В вашем шаблоне .html сделайте это,

<ion-list *ngIf="data2">
    <div *ngFor="let data of data2">

        <ion-item lines="none">
            <ion-label text-left>
                Fruit Name:
            </ion-label>
            <ion-label text-right>
                {{data.FruitName}}
            </ion-label>
        </ion-item>

        <ion-item lines="none">
            <ion-label text-left>
                Install Date:
            </ion-label>
            <ion-label text-right>
                {{data.installTime}}
            </ion-label>
        </ion-item>

        <ion-item>
            <ion-label text-left>
                Remove Date:
            </ion-label>
            <ion-label text-right>
                {{data.removeTime}}
            </ion-label>
        </ion-item>


    </div>

</ion-list>

Объяснение. Поскольку ваш результат хранения представляет собой объект, похожий на обещание, вам нужно подождать, пока он не разрешится. Вы можете сделать это, выполнив проверку шаблона состояния переменной data2, которую вы пытаетесь установить с помощью вызова хранилища. Первоначально он не установлен, но после разрешения вызова хранилища он устанавливается. Это разрешение может произойти за пределами хуков жизненного цикла angular, поэтому вы видите страницу сначала пустой, а затем, когда вы перезагружаете, она работает нормально.