Angularjs 离子玻片，每个玻片与ng重复重叠

我是爱奥尼亚、html、angular和java脚本的真正新手。我有一个应用程序，它获取一些JSON数据，并用

ng repeat

显示

但当我试图切换到下一张幻灯片时，它重叠了。我有一个$interval，每5秒刷新一次JSON，它也会重置为第一张幻灯片

此处为html：

<ion-view title="home">
<ion-content ng-controller="temperatureCtrl">        
  <div ng-init="init()"></div>
    <ion-slides  options="options" slider="data.slider" >
        <ion-slide-page ng-repeat="channel in channels">
          <div class="list">
            <h2><center>canal# {{channel.canal}}</center></h2>                   
            <br/>
            <center>
              <button class="button button-stable" ng-click="switchChannel(channel, channel.canal)" ng-model="channel.status">
                {{channel.status}}
              </button>
            </center>
            <div class="list">
              <label class="item item-input">            
                <input type="text" style="text-align:center;" placeholder="Channel name" ng-model="channel.name" ng-focus="stopRefresh()" ng-blur="restartRefresh()">
              </label>
            </div>
            <h4><center>
            <span class="Ainput" ><h3>{{channel.temperature}}&#186;C</h3></span>
            </center></h4>
            <h3><center>Setpoint= {{channel.setPoint}}</center></h3><br>
            <div class="item range range-positive">                  
              <i class="icon ion-minus-round"></i>                   
                <input type="range" name="setpoint" min="5" max="30" step="0.5" value="33" ng-model="channel.setPoint" ng-focus="stopRefresh()" ng-blur="restartRefresh()">
              <i class="icon ion-plus-round"></i>
            </div>
            <centrer>
              <button  class="button button-dark button-block padding " ng-click="channelsClk(channel, channel.setPoint)">ok</button>
            </centrer>
            <h3>
              <span class="permRun">{{channel.permission}}</span>
            </h3>
            <h3>
              <span class="AoutputChannel">{{channel.percentOut}}%</span>
            </h3>
        </ion-slide-page>                  
    </ion-slides>        
</ion-content>

---

删除选项以解决问题

$scope.options = {
  loop: false,
 //effect: 'fade', /*   <--  */
speed: 500,
}

$scope.options={
循环：false，
//效果：“淡入淡出”，/*删除淡入淡出选项解决问题

$scope.options = {
  loop: false,
 //effect: 'fade', /*   <--  */
speed: 500,
}

$scope.options={
循环：false，
//效果：“褪色”/*