Help! How do I make option labels conditional in Action Sheets?

@ssktanaka wrote:

I want the options in my Ionic action sheet to change text based on a condition. Specifically, I want the option to read "Flag" if a list item is not flagged ($scope.flag = false), and "Unflag" if it's flagged ($scope.flag = true).

Right now, I have the text label reading:
<div ng-show="flag">Flag</div> <div ng-show="!flag">Unflag</div>

But it's not working. Instead, all I see are both options. Does anyone know how to fix this? My full code is below and in this codepen.

HTML:

<ion-content>
   <ion-list>
    <ion-item
    on-hold="showActionSheet()"
    >
      Item 1
    </ion-item>      
  </ion-list>
</ion-content>

JAVASCRIPT:

angular.module('ionicApp', ['ionic'])
.controller('MyCtrl', function($scope, $timeout, $ionicActionSheet, $ionicListDelegate) {
   $scope.flag = true;
    $scope.showActionSheet = function() {
     // Show the action sheet
     var hideSheet = $ionicActionSheet.show({
       buttons: [
         { text: '<div ng-show="flag">Flag</div><div ng-show="!flag">Unflag</div>' },
       ],
       titleText: 'Action Sheet',
       cancelText: 'Cancel',
       cancel: function() {
            // add cancel code..
          },
       buttonClicked: function(index) {
            $scope.flag = !$scope.flag ;  
            return true;
       }
     });
  };
});

Posts: 1

Participants: 1

Read full topic