Using $scope in popup (AngularJS + Ionic)

Question

I followed documentation to set a Ionic popup in my project. This works well except one thing.

When I call the function, I'm not in controller (I'm in services.js), so when I define scope: $scope, I have an obvious $scope is unknown error.

How do you solve this? Thanks a lot !

Find bellow the full code if you need it.

controllers.js

$scope.confirm_redeem_reward = function(asked_reward) {
      RewardModel.displayConfirmRedeemReward(asked_reward)
    };

services.js

...

  RewardModel.displayConfirmRedeemReward = function(asked_reward) {
     var confirmPopup = $ionicPopup.confirm({
       title: 'Confirmation',
       templateUrl: 'templates/popups/confirm_redeem_reward.html',
       scope: $scope,
       buttons: [{
          text: 'Cncel',
          type: 'button-default'
        }, {
          text: 'OK',
          type: 'button-positive',
          onTap: function(e) {
            RewardModel.useReward(asked_reward.id);
            RewardModel.used_reward_or_deal_name = asked_reward.name;
          }
        }]

     });
     confirmPopup.then(function(res) {
       // Nothing
     });
    };

confirm_redeem_reward.html

Do you want to redeem the reward :
{{asked_reward.name}} ?

Passing $scope as a parameter of RewardModel.displayConfirmRedeemReward ? — Khanh Nguyen
– Khanh Nguyen, Commented Oct 24, 2014 at 0:19
I was told it's a bad practice ("Treat scope as read only in templates, Treat scope as write only in controllers" from the Zen Of Angular). I tried anyway and it does not seem to work (no error in console but result is not displayed) — David Dahan
– David Dahan, Commented Oct 24, 2014 at 0:32

SaW · Accepted Answer · 2015-07-15 19:02:28Z

1

I ran into the same dilemma, whether to use a controller or a service. It feels to me that a service is a slightly better solution, since the controller for the popup is already wrapped within ionicPopup function. (I.e. i'm not writing the controller, i just delegate to ionicPopup) So I fixed it for now by injecting rootScope into the service and create the scope myself:

    return {
        showPopup: function () {
            var $scope = $rootScope.$new();
            $scope.data = {};

Still it feels awkward to have UI stuff within a service, so i'm open for alternatives.

Stephan

answered Jul 15, 2015 at 19:02

SaW

3711 gold badge4 silver badges8 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Watto · Accepted Answer · 2014-10-27 18:21:38Z

0

I think you are using popup in a wrong place. You must separate functionalities and showing a popup is a function that must be in controller instead.

If you do that way, it will work perfectly ;)

answered Oct 27, 2014 at 18:21

Watto

811 silver badge8 bronze badges

3 Comments

David Dahan Over a year ago

Why do you think popup is a function that must be in a controller?

Watto Over a year ago

Because I think that services must provide data to controllers, and controllers must use this data to send it to view or, in this case, make changes in the view, like change the view or load popup windows. It is a good practice to separate functionalities and MVC patterns are for this purpose.

shruti Over a year ago

Don't you think all popups that are in application should be called from one global method in app that will differentiate which type of popup should be called and according to it will call it, rather implementing this in each controller where i need to call popup. Is that global method has to be placed in a new service ?

Collectives™ on Stack Overflow

Using $scope in popup (AngularJS + Ionic)

2 Answers 2

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related