javascript – Ionic：ng-show和页面转换

我正在开发一个带有Ionic的移动应用程序,但我还不熟悉这个框架或Angular.您可以点击一些列表项来查看包含一些详细信息的页面.

这是我的列表模板：

<ion-view view-title="In der Nähe">
  <ion-content>
    <ion-refresher
      pulling-text="Aktualisieren"
      on-refresh="loadData()">
    </ion-refresher>
    <ion-list>
      <ion-item href="#/event/location-details" ng-click="showDetails(location)" ng-repeat="location in locations">
        {{location.name}}
      </ion-item>
    </ion-list>

  </ion-content>
</ion-view>

控制器：

...
  $scope.showDetails = function(location)
  {
    $rootScope.currentLocationDetails = location;
  };
  ...

这是详细信息页面：

<ion-view view-title="{{location.name}}">
  <ion-content class="padding">
    <button ng-show="location.attr.wheelchair == 'yes'" class="button icon ion-paper-airplane button-balanced"></button>
    <button ng-show="location.attr.wheelchair == 'limited'" class="button icon ion-paper-airplane button-assertive"></button>
    <button ng-show="location.attr.wheelchair == 'no'" class="button icon ion-paper-airplane button-energized"></button>

    <button ng-show="location.attr.food == 'yes'" class="button icon ion-pizza button-balanced"></button>
    <button ng-show="location.attr.food == 'no'" class="button icon ion-pizza button-energized"></button>

    <button ng-show="location.attr.internet_access == 'yes'" class="button icon ion-wifi button-balanced"></button>
    <button ng-show="location.attr.internet_access == 'no'" class="button icon ion-wifi button-energized"></button>

    <button ng-show="location.attr.smoking == 'no'" class="button icon ion-no-smoking button-balanced"></button>
    <button ng-show="location.attr.smoking == 'yes'" class="button icon ion-no-smoking button-energized"></button>
  </ion-content>
</ion-view>

控制器：

app.controller('DetailsController',function($scope,$rootScope)
{
  $scope.location = $rootScope.currentLocationDetails;
});

这适用于Android设备但iOS上存在问题：

Angular似乎在页面转换之后/期间评估ng-show指令.

这是它在Android上的外观：
https://www.youtube.com/watch?v=aspI95Jm574

运行iOS 8的iPad：
https://www.youtube.com/watch?v=oCf3V8ewq40

您可以看到动画期间所有按钮都可见.

我究竟做错了什么？这是Ionic的一个错误吗？在这种情况下,是否有更好的方法将location对象传递给DetailsController？

如果您需要查看更多代码,请告诉我们.

谢谢！

解决方法

另一种解决方法是在每个具有ng-hide或ng-show属性的元素上使用ng-hide类.

<div class="ng-hide" ng-show="isVisible">my element</div>

这将确保在角度编译之前隐藏元素.稍后当角度启动时,ng-show / hide指令将处理ng-hide类.