编程语言
首页 > 编程语言> > Javascript-Ionic-未在工厂内部的$ionicPopup.show中返回值$scope

Javascript-Ionic-未在工厂内部的$ionicPopup.show中返回值$scope

作者:互联网

我用$ionicPopup创建了一个项目.我将$ionicPopup代码放在.factory中.在我的$ionicPopup.show()中,我要求用户输入一个值.用户输入值后,它将提醒该值用户所写内容.

我还检查了以下帖子,但仍然无法解决我的问题Access scope inside an angular js factory.

所以这是我的代码:

控制者

.controller('PopupCtrl',function($scope, $ionicPopup, $timeout, popupService) {

 // Triggered on a button click, or some other target
 $scope.showPopup = function() {

   var showParameter = {
     title: "Test",
     cssClass: "",
     subTitle: "Insert any value",
     template: '<input type="text" ng-model="value">',
     templateUrl: "",
     buttons: {
       cancelText: "Reject",
       cancelType: "button-assertive",
       okText: "Accept",
       okType: "button-positive"
     }
   }

   // An elaborate, custom popup
   popupService.show(showParameter, $scope).then(function(res) {
     console.log('Tapped!', res);
     alert("value: " + res);
   });
  };
})

.factory('popupService', function ($ionicPopup) {
    return{
        show: function(param, scope){
          var show = $ionicPopup.show({
              title: param.title, // String. The title of the popup.
              cssClass: param.cssClass, // String, The custom CSS class name
              subTitle: param.subTitle, // String (optional). The sub-title of the popup.
              template: param.template, // String (optional). The html template to place in the popup body.
              templateUrl: param.templateUrl, // String (optional). The URL of an html template to place in the popup   body.
              scope: scope, // Scope (optional). A scope to link to the popup content.
              buttons: [{ // Array[Object] (optional). Buttons to place in the popup footer.
                text: param.buttons.cancelText,
                type: param.buttons.cancelType,
                onTap: function(e) {
                  return false;
                }
              }, {
                text: param.buttons.okText,
                type: param.buttons.okType,
                onTap: function(e) {
                  // Returning a value will cause the promise to resolve with the given value.
                  return scope.value;
                }
              }]
           });
          return show;
        }
    }
 });

演示:http://codepen.io/aishahismail/pen/pgpdGW?editors=101

确实需要您的帮助.谢谢.

解决方法:

由于JS(和Angular)对象继承[1],您必须在对象中“包装”原语,因此这是工作代码(从您的代码派生):

http://codepen.io/beaver71/pen/JGMvdV

关键编辑如下:

$scope.data = {};

...

template: '<input type="text" ng-model="data.value">'

[1]弹出窗口从控制器继承其范围.参见:https://github.com/angular/angular.js/wiki/Understanding-Scopes

标签:scope,angularjs,ionic-framework,javascript,ionicpopup
来源: https://codeday.me/bug/20191119/2033870.html