ionicPopup cannot get input value

Question

I follow the sample of $ionicPopup.show here but fail.

angular.module('main').directive('dtDiscount', function($ionicPopup) {
    return {
        require: 'ngModel',
        scope: {
            operators: '=operators',
            toggle: '=toggle',
        },
        templateUrl: 'templates/components/discount.html',
        link: function ($scope, $element, $attrs, ctrl) {

            $scope.customeDiscount = 0;
            $scope.setCustomDiscount = function(){
                $ionicPopup.show({
                    title: 'Input Your Own Discount',
                    subTitle: 'XX %off',
                    template: '<input type="number" ng-model="customeDiscount"/>', // the preset value show 0, which is expected.
                    scope: $scope,
                    buttons: [{ text: 'Cancel' },{
                        text: '<b>Confirm</b>',
                        type: 'button-positive',
                        onTap: function(e) {
                            console.log($scope.customeDiscount); // 0
                            return $scope.customeDiscount;
                        }
                    }]
                });
            }

            $scope.$watch('customeDiscount', function(value){
                console.log(value);
            });
        }
    }
})

Whatever I input any value for customeDiscount, it always gives me 0 output, such that the value $scope.customeDiscount cannot be changed.

Can someone help me to find out what is the problem?

Answer 1

//old $scope.customeDiscount = 0;
$scope.data = {};

        $scope.setCustomDiscount = function(){
            $ionicPopup.show({
                title: 'Input Your Own Discount',
                subTitle: 'XX %off',
                template: '<input type="number" ng-model="data.customeDiscount"/>', // the preset value show 0, which is expected.
                scope: $scope,
                buttons: [{ text: 'Cancel' },{
                    text: '<b>Confirm</b>',
                    type: 'button-positive',
                    onTap: function(e) {
                        console.log($scope.data.customeDiscount); // 0
                        return $scope.data.customeDiscount;
                    }
                }]
            });
        }