How to display the icon in actionsheet button according to selected button


#1

Hi, I’m trying to implement sorting into my app using the $ionicactionsheet. What I want to do is to display the icon of the current selected option from action sheet so the user knows the selected preference.

$scope.showActionsheetCalc = function () {
        $scope.totalPriceCalc = true;
        $scope.perPersonPrices = false;

        $ionicActionSheet.show({
            titleText: 'Calculate Price',
            buttons: [
              { text: '<i ng-show="perPersonPrices" class="icon ion-checkmark"></i>  Per person + Taxes & Fees' },
              { text: '<i ng-show="totalPriceCalc" class="icon ion-checkmark"></i>  Total + Taxes & Fees' },
              ],
            //destructiveText: 'Delete',
            cancelText: 'Cancel',
            //cancel: function () {
            //    console.log('CANCELLED');
            //},
            buttonClicked: function (index) {
                if (index == 0) {
                    $scope.perPersonPrices = true;
                    $scope.totalPriceCalc = false;
                } else if (index == 1) {
                    $scope.perPersonPrices = false;
                    $scope.totalPriceCalc = true;
                }
                console.log('BUTTON CLICKED', index);
                return true;
            }//,
            //destructiveButtonClicked: function () {
            //    console.log('DESTRUCT');
            //    return true;
            //}
        });
    };

As you can see I tried with ng-show but no results, the ng-show attribute doesn’t show up in the genereated HTML.

PS: The results are filtered fine I just want to display the checkmark icon under the selected sorter criteria.