Question

我有离子列表和离子选项按钮

<ion-list show-delete="data.showDelete" show-reorder="data.showReorder">
            <ion-item ng-repeat="milestone in milestones" item="item milestone" class="item-remove-animate">
                <div class="ft-14 db-txt txt-reg ws-nor">{{milestone.text}}</div>
                <ion-option-button class="button-positive lg-m-align" ng-click="achieve(milestone)">
                    <i class="lg-icon-tick-thick ft-20"></i>
                </ion-option-button>
                <ion-option-button class="button-dark lg-m-align" ng-click="delete(milestone)">
                    <i class="lg-icon-delete ft-24"></i>
                </ion-option-button>
                <ion-option-button class="button-balanced lg-m-align" ng-click="edit(milestone)">
                    <i class="lg-icon-edit ft-24 db-txt"></i>
                </ion-option-button>
                <!--ion-reorder-button class="ion-navicon" on-reorder="moveItem(item, $fromIndex, $toIndex)"></ion-reorder-button-->
            </ion-item>
            <ion-item class="item">
                   <input type="text" ng-model="newMilestone.text" placeholder="Add New"  />
            </ion-item>
        </ion-list>

假设我向左滑动一个项目。然后出现按钮。我点击一个按钮就可以完成它应该做的事情。但下次我想要的是它可以隐藏一些选项按钮。

感谢您的帮助

Answer 1

在控制器中，您可以使用 $ scope 设置可在html模板中使用的变量。我们假设我们创建一个变量 test 并将其设置为true：

$scope.test = true;

在此之后，您可以使用html中的变量。因此，当测试为真时，我们要隐藏一个选项按钮：

<ion-option-button ng-hide="test">Testoption</ion-option-button>

以同样的方式，您可以使用 ng-show ，然后只有当变量为真时才显示html实体。

隐藏离子离子选项按钮

1 个答案: