Question

我有一个幻灯片框，我希望它在我点击按钮时显示，因此我将ng-show附加到ion-slide-box用于此目的，如下所示：

<ion-slide-box ng-show="show" does-continue="true">

          <ion-slide>
            <div class="list card item-card">

              <div class="item">
                <h2>Item_Name</h2>
                <p class="size"><i class="icon ion-tshirt"></i> 36-45</p>
              </div>

              <div class="item item-body text-center">
                <img class="item-image" ng-src="img/3.png">
              </div>

              <div class="item">

                <span class="price">25<i class="icon ion-social-usd"></i></span>
              </div>

            </div>
          </ion-slide>

          <ion-slide>
            <div class="list card item-card">

              <div class="item">
                <h2>Item_Name</h2>
                <p class="size"><i class="icon ion-tshirt"></i> 36-40</p>
              </div>

              <div class="item item-body text-center">
                <img class="item-image" ng-src="img/3.png">
              </div>
                  <div class="item ">
                                   <span class="price">30<i class="icon ion-social-usd"></i></span>
              </div>
                </div>
          </ion-slide>

        </ion-slide-box>

按钮代码如下：

<button class="button" on-touch="showslidebox()">click</button>

showslidebox()功能如下：

$scope.show = false; //default: false
  $scope.showslidebox= function() {
    $scope.show = true;
}

当我点击按钮时，幻灯片框html元素出现在谷歌检查的元素部分，但它没有出现在屏幕上，这是有线的，我尝试了几乎所有但仍然无法正常工作。（在控制台中也没有错误日志）。任何想法可能是什么问题？

Answer 1

好吧，我最后通过编辑如下代码来解决问题：

  $scope.show = false;
  $scope.click = function () {
    console.log('click');
    $scope.show = !($scope.show);
    $ionicSlideBoxDelegate.update();
  }

希望它可以帮助别人。

Answer 2

您似乎已将某些css分配给class="animated fadeInRight item-remove-animate"

也许item-remove-animate做错了。

当ng-show为真时，离子滑动框不显示

2 个答案: