ionic——$ionicPopup 自定义弹窗

最新推荐文章于 2021-06-03 14:02:25 发布

who_become_gods

最新推荐文章于 2021-06-03 14:02:25 发布

阅读量965

点赞数

本文链接：https://blog.csdn.net/who_become_gods/article/details/111683101

版权

本文介绍了如何在Ionic应用中利用$ionicPopup的templateUrl属性来自定义弹窗内容，通过引用HTML文件实现个性化弹窗。示例中给出了angular环境下，与tab-privacyAgree.html和privacyAgreeController.js相关的实现方式。

摘要由CSDN通过智能技术生成

ionic 弹窗写法
上述链接所讲的弹窗内容模板是官网固定写好的，有时就不满足自己项目所需，官网介绍了一个属性，可以自定义弹窗内容

templateUrl
所引用弹窗内容的 html文件地址

//弹窗
var confirmPopup = $ionicPopup.confirm({
   
    title: '服务协议与隐私政策',
    templateUrl: '../templates/tab-privacyAgree.html',
    // template: '欢迎使用爱鲸准APP,在你使用爱鲸准APP服务前，请认真阅读《服务协议》和《隐私协议》全部条款。我们非常重视您的用户权益与个人信息的保护，我们将通过上诉协议向你说明我们如何为你提供服务并保障你的用户权益，如你同意，请点击“同意并继续”接受我们的服务。',
    cssClass: 'new_confirm',//自定义的样式名称，在这个样式名称下修改popup的样式，用以覆盖默认样式。
    cancelText: '不同意并退出',//取消按钮
　　                    okText: '同意并继续',//确认按钮
})
confirmPopup.then(function(res) {
   
    if(res){
    //同意
        localStorage.setItem("isApply",true)
        //检测是否有自动更新
        var versionCode = AppVersion.build
        //判断当前是否是苹果机
        var isAndroid = navigator.userAgent.indexOf('Android') > -1 || navigator.userAgent.indexOf('Adr') > -1
        if(isAndroid){
   
            var versionCode = AppVersion.build;
            console.log(versionCode); 
            //app android 自动更新
            var updateUrl = "https://jingzhun.s3.cn-northwest-1.amazonaws.com.cn/app/version.xml";
            window.AppUpdate.checkAppUpdate(
                function () {
   
                    console.log("success");
                }, 
                function () {
   
                    console.log("fail");
                }, updateUrl
            )
        }
    }else{
    //不同意
        ionic.Platform.exitApp()
    }
});

下面以angular举例
tab-privacyAgree.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.6/angular.min.js"></

最低0.47元/天解锁文章

who_become_gods

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
ionic——$ionicPopup 自定义弹窗

ionic 弹窗写法上述链接所讲的弹窗内容模板是官网固定写好的，有时就不满足自己项目所需，官网介绍了一个属性，可以自定义弹窗内容templateUrl所引用弹窗内容的 html文件地址//弹窗var confirmPopup = $ionicPopup.confirm({ title: '服务协议与隐私政策', templateUrl: '../templates/tab-privacyAgree.html', // template: '欢迎使用爱鲸准APP,在你使
复制链接

扫一扫