Ionic弹窗服务允许程序创建、显示弹出窗口,需要用户继续响应。

弹窗系统支持更多灵活的构建alert()prompt()confirm()功能版本,以及用户习惯,除了允许查看完全自定义内容的的弹窗。

angular.module('mySuperApp', ['ionic'])
.controller(function($scope, $ionicPopup, $timeout) { // 触发一个按钮点击,或一些其他目标
$scope.showPopup = function() {
$scope.data = {} // 一个精心制作的自定义弹窗
var myPopup = $ionicPopup.show({
template: '<input type="password" ng-model="data.wifi">',
title: 'Enter Wi-Fi Password',
subTitle: 'Please use normal things',
scope: $scope,
buttons: [
{ text: 'Cancel' },
{
text: '<b>Save</b>',
type: 'button-positive',
onTap: function(e) {
if (!$scope.data.wifi) {
//不允许用户关闭,除非他键入wifi密码
e.preventDefault();
} else {
return $scope.data.wifi;
}
}
},
]
});
myPopup.then(function(res) {
console.log('Tapped!', res);
});
$timeout(function() {
myPopup.close(); //由于某种原因3秒后关闭弹出
}, 3000); // 一个确认对话框
$scope.showConfirm = function() {
var confirmPopup = $ionicPopup.confirm({
title: 'Consume Ice Cream',
template: 'Are you sure you want to eat this ice cream?'
});
confirmPopup.then(function(res) {
if(res) {
console.log('You are sure');
} else {
console.log('You are not sure');
}
});
}; // 一个提示对话框
$scope.showAlert = function() {
var alertPopup = $ionicPopup.alert({
title: 'Don\'t eat that!',
template: 'It might taste good'
});
alertPopup.then(function(res) {
console.log('Thank you for not eating my delicious ice cream cone');
});
};
};
});

原文出处:http://www.ionic.wang/js_doc-index-id-52.html

最新文章

  1. BZOJ 3238: [Ahoi2013]差异 [后缀数组 单调栈]
  2. Entity Framework 6 Recipes 2nd Edition(12-1)译 -&gt; 当SaveChanges( ) 被调用时执行你的代码
  3. Mysql远程访问
  4. java 多线程之wait(),notify,notifyAll(),yield()
  5. 深入了解Struts2返回JSON数据的原理
  6. Python-day-21
  7. JavaScript基础——数据类型
  8. springboot教程
  9. CSS_复习
  10. memcached在windows下的安装与命令使用方法
  11. 关于int **
  12. IoC/DIP其实是一种管理思想
  13. eclipse安装svn插件的多种方式
  14. shell脚本中字符串的常见操作及&quot;command not found&quot;报错处理(附源码)
  15. LINUX 笔记-wc命令
  16. 批量ping测试的脚本
  17. 转载:深入理解Scala的隐式转换系统
  18. SQL注入之Sqli-labs系列第二十一关(基于复杂性的cookie POST报错注入)和二十二关(基于双引号的cookie POST报错注入)
  19. 自己开发Visual studio插件-一个nvelocity高亮插件
  20. Layui:设置select下拉框自动选中某项

热门文章

  1. Oracle - Unprocessed Material
  2. 查找mysql数据文件存放路径
  3. Robot Framework+appium集成安装
  4. Matlab无法打开M文件的错误( Undefined function or method &#39;uiopen&#39; for input arguments of type &#39;char)
  5. Bootstrap+MetroNic_1.5.4 Head meta
  6. sql date 的精度问题
  7. [LeetCode] 86. Partition List 解题思路
  8. Yii框架tips(转)
  9. Install MongoDB on Windows
  10. IIS- ASP站点布署时查看ASP错误信息