处理$ ionicPopup提示中的多个按钮

Jos*_*dón 3 javascript ionic-framework ionic

文件说:

显示一个简单的提示弹出窗口,其中包含输入,确定按钮和取消按钮.如果用户按下OK,则使用输入的值解析promise;如果用户按下Cancel,则使用undefined解析.

我在做:

$ionicPopup.prompt({ 
  //options 
}).then(function (userinput) {
  //get userinput and send to server
});
Run Code Online (Sandbox Code Playgroud)

我需要添加第三个按钮,但无法获取输入的文本,如何解决按钮的onTap事件上的承诺以获取输入?

  $ionicPopup.prompt({
   title: '¿Are you sure?',
   inputType: 'text',
   buttons: [
   { text: 'Cancel' 
     //close popup and do nothing
   },
   {
    text: 'NO',
    type: 'button-assertive',
    onTap: function(e) {  
      //send to server response NO
    }
   },
   {
    text: 'YES',
    type: 'button-energized',
    onTap: function(e) { 
      //get user input and send to server
    }
   }]
Run Code Online (Sandbox Code Playgroud)

Mud*_*jaz 5

请参阅我使用您的代码制作的演示:http://play.ionic.io/app/ac79490c8914
prompt()并不是要添加两个以上的按钮,show()用于制作复杂的弹出窗口,请参阅show()相同文档中的方法.如文档中所述,我引用:

显示复杂的弹出窗口.这是所有弹出窗口的主显示功能.

复杂的弹出窗口有一个按钮数组,除了onTap函数外,每个按钮都有一个文本和类型字段.

你的代码就像:

$scope.showPop = function(){
    $scope.data = {};
    var myPopup = $ionicPopup.show({
    template: '<input type="text" ng-model="data.myData">',
    title: '¿Are you sure?',
    scope: $scope,
    buttons: [
   { text: 'Cancel' 
     //close popup and do nothing
   },
   {
    text: 'NO',
    type: 'button-assertive',
    onTap: function(e) {  
      return null;
    }
   },
   {
    text: 'YES',
    type: 'button-energized',
    onTap: function(e) { 
      return $scope.data.myData;
    }
   }]
  });
  myPopup.then(function(userinput) {
    if(userinput){
      console.log('returned data'+ userinput)
    }
  });
}
Run Code Online (Sandbox Code Playgroud)

上面代码的简单之处在于您使用$scope(<input type="text" ng-model="data.myData">)绑定输入,以便以任何方式访问它.