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)
请参阅我使用您的代码制作的演示: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">)绑定输入,以便以任何方式访问它.