Reload image on orientation change


#1

Actually I want to show two different images for two orientations .

.state('tab.one', {
      url: '/one',
      views: {
        'tab-one': {
          templateUrl: function () {
    if (window.matchMedia("(orientation: portrait)").matches) {return 'temp/tab-one.html'}
    else {return 'temp/tab-two.html'}
  },
          controller: 'OneCtrl'
        }
      }
    })

i fetched two different images from two different html.But it is not working in run time screen orientation changes.
then I used

<ion-slide ng-if="showPortrait"  ng-repeat="image in allImages_v">
      <div >
         <img class="pane"  ng-src="{{image.src}}">
      </div>
   </ion-slide>

   <ion-slide ng-if="showLandscape"  ng-repeat="image in allImages_h">
      <div >
         <img class="pane"  ng-src="{{image.src}}">
      </div>
   </ion-slide>

In my one html. But still the problem is same. I want to reload the page when screen orientation gets changed. Any help will be highly appreciated.