关于使用angular1.X+ionic进行移动端开发的问题汇总

1.ion-item标签使用时如果padding设置为0,如果该页面数据全是动态获取,在某些机型上会显示空白.

解决方法:padding设为0.1px;

2.与原生端交互时,原生端是不能直接获取到controller里的方法的,需要在html页面上标明ng-controller

调用原生示例方法

function getRunContext() {//获取设备类型

    var type= "";

    var contextInfo= navigator.userAgent;

    if (contextInfo.indexOf('Android')> -1 || contextInfo.indexOf('Adr')> -1) {

        type= "Android";

    }else if (!!contextInfo.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)) {

        type= "ios";

    }

    return type;

}

//  判断是否存在某个变量。适用于函数参数判断、一般数据

//  @arguments:  单个或多个参数

// 自定义函数

function isValidVarible(arguments) {

    try {

        for (var i= 0; i< arguments.length; i++) {

            if (typeof(arguments[i])== "undefined" || arguments[i].length== 0) {

                return false;

            }else {

                return true;

            }

        }

    }catch (e) {

        console.log(e);// 后期写入日志；

    }

    returnfalse;

}

// 调用原生通用接口

        this.callNativeFuntionInterface  = function (controllerName,callfunction, callbackFun, params) {

        //this.getRunContext();//此方法用于判断设备类型

            var isvalid = isValidVarible(callfunction, callbackFun, controllerName);

            if (isvalid) {

                var appElementString = "document.querySelector('[ng-controller={0}]')".format(controllerName);

                var callbackFunName = "angular.element({0}).scope()".format(appElementString) + ".{0}".format(callbackFun);

                var runContext = $rootScope.runContext;

                if (runContext == "Android") {

                    // AndroidFun.getDeviceInfoFromAndroid();

                    //获取angular　element　来得到　方法

                    // var $mycon = angular.element(document.querySelector('[ng-controller="'+controllerName+'"]')).scope();

                    // //安卓回调方法

                    // window[callbackFun] = $mycon[callbackFun];

                    //回调方法名传到andriod原生

                    params.callback = callbackFunName;

                    var parms = params;

                    if(androidNativeFun != undefined){

                        androidNativeFun[callfunction](JSON.stringify(parms));

                    }

                } else if (runContext == "ios") {

                    var message = {

                        'method': callfunction,

                        'params': params,

                        'callback': callbackFunName

                    }

                    if(window.webkit != undefined){

                        window.webkit.messageHandlers.JSCallIOS.postMessage(message);

                    }

                }

            }

        }

3.设置当前时间前后N天,N月同理dd.setMonth(dd.getMonth()+ 1 + month);

function setDateDay(AddDayCount){//传入需要设置的天数 如+7,-7,输出格式为YYYY-MM-DD

        var dd= new Date();

        dd.setDate(dd.getDate()+AddDayCount);

        var y= dd.getFullYear();

        var m= (dd.getMonth()+1<10?"0"+(dd.getMonth()+1):(dd.getMonth()+1));

        var d= dd.getDate()<10?"0"+dd.getDate():dd.getDate();

        returny+"-"+m+"-"+d;

}

4.将YYYY-MM-DD转换为date格式

function StringToDate(s) {//将YYYY-MM-DD转换为Date格式

        var d= new Date();

        d.setYear(parseInt(s.substring(0,4),10));

        d.setMonth(parseInt(s.substring(5,7)- 1,10));

        d.setDate(parseInt(s.substring(8,10),10));

        // d.setHours(parseInt(s.substring(11, 13), 10));

        // d.setMinutes(parseInt(s.substring(14, 16), 10));

        // d.setSeconds(parseInt(s.substring(17, 19), 10));

        return d;

}

5.页面下载文件方法

function downFiles(blob, fileName) { //获取mimetypes  blob为文件流 fileName输入格式为(XXX.后缀名)

//filename，摘取常用部分

    let mimetypes= {

        'doc': 'application/msword',

        'bin': 'application/octet-stream',

        'exe': 'application/octet-stream',

        'db': 'application/octet-stream',

        'so': 'application/octet-stream',

        'dll': 'application/octet-stream',

        'pdf': 'application/pdf',

        'ai': 'application/postscript',

        'xls': 'application/vnd.ms-excel',

        'ppt': 'application/vnd.ms-powerpoint',

        'dir': 'application/x-director',

        'js': 'application/x-javascript',

        'swf': 'application/x-shockwave-flash',

        'xhtml': 'application/xhtml+xml',

        'xht': 'application/xhtml+xml',

        'zip': 'application/zip',

        'mid': 'audio/midi',

        'midi': 'audio/midi',

        'mp3': 'audio/mpeg',

        'rm': 'audio/x-pn-realaudio',

        'rpm': 'audio/x-pn-realaudio-plugin',

        'wav': 'audio/x-wav',

        'bmp': 'image/bmp',

        'gif': 'image/gif',

        'jpeg': 'image/jpeg',

        'jpg': 'image/jpeg',

        'png': 'image/png',

        'css': 'text/css',

        'html': 'text/html',

        'htm': 'text/html',

        'txt': 'text/plain',

        'xsl': 'text/xml',

        'xml': 'text/xml',

        'mpeg': 'video/mpeg',

        'mpg': 'video/mpeg',

        'avi': 'video/x-msvideo',

        'movie': 'video/x-sgi-movie'

    }

    let fileNameLast= fileName.substring(fileName.lastIndexOf("."), fileName.length)

    let filetypes= mimetypes[fileNameLast+ ""];

    var blob= new Blob([blob], {type: filetypes+ ""});

    if(window.navigator.msSaveOrOpenBlob) {//文件下载ie兼容

        navigator.msSaveBlob(blob, fileName);

    }else{

        var link = document.createElement('a');

        link.href= window.URL.createObjectURL(blob);    

        link.download= fileName;        

        link.click();

        window.URL.revokeObjectURL(link.href);

    }

}

6.格式化金额千分位

/*

* 格式化金额千分位

* 参数说明：

* number：要格式化的数字

* decimals：保留几位小数

* dec_point：小数点符号

* thousands_sep：千分位符号

* roundtag:舍入参数，默认 "ceil" 向上取,"floor"向下取,"round" 四舍五入

* */

function NumberFormatService() {

    return{

        numberFormat:function(number, decimals, dec_point, thousands_sep, roundtag) {

        number = (number + '').replace(/[^0-9+-Ee.]/g,'');

        roundtag= roundtag|| "ceil";//"ceil","floor","round"

        var n= !isFinite(+number)? 0 :+number,

            prec= !isFinite(+decimals)? 0 : Math.abs(decimals),

            sep= (typeof thousands_sep=== 'undefined')? ',': thousands_sep,

            dec= (typeof dec_point=== 'undefined')? '.': dec_point,

            s= '',

            toFixedFix= function(n, prec) {

                var k= Math.pow(10, prec);

                return '' + parseFloat(Math[roundtag](parseFloat((n* k).toFixed(prec* 2))).toFixed(prec* 2))/ k;

            };

    s= (prec? toFixedFix(n, prec) :'' + Math.round(n)).split('.');

    var re = /(-?\d+)(\d{3})/;

    while(re.test(s[0])) {

        s[0]= s[0].replace(re,"$1" + sep+ "$2");

    }

if((s[1]|| '').length< prec) {

s[1]= s[1]|| '';

s[1]+= new Array(prec- s[1].length+ 1).join('0');

}

return s.join(dec);

}

}

}


7.获取手机型号

/*

* 获取手机型号

* */

function getPhoneModel() {

return{

phoneModel:function() {

//判断数组中是否包含某字符串 

Array.prototype.contains = function(needle) {

for(iin this) {

if(this[i].indexOf(needle)> 0)

return i;

}

return -1;

}

var device_type= navigator.userAgent;

var md= new MobileDetect(device_type);

var os= md.os();

var model= "";

if(os== "iOS") {//ios系统的处理 

os= md.os()+ md.version("iPhone");

model= md.mobile();

}else if(os == "AndroidOS") { //Android系统的处理 

os= md.os()+ md.version("Android");

var sss= device_type.split(";");

var i= sss.contains("Build/");

if(i> -1) {

model= sss[i].substring(0, sss[i].indexOf("Build/"));

}

}

return model.trim();

}

}

}


8.邮箱正则

var reg =  /^[a-zA-Z0-9]+((([-_.][a-zA-Z0-9]+)|[a-zA-Z0-9])+)@([a-zA-Z0-9]+[-.])+[a-zA-Z0-9]{2,3}$/

reg.test(str);

©著作权归作者所有,转载或内容合作请联系作者
  • 人面猴
    序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
    沈念sama阅读 204,921评论 6赞 478
  • 死咒
    序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
    沈念sama阅读 87,635评论 2赞 381
  • 救了他两次的神仙让他今天三更去死
    文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
    开封第一讲书人阅读 151,393评论 0赞 338
  • 道士缉凶录：失踪的卖姜人
    文/不坏的土叔 我叫张陵，是天一观的道长。 经常有香客问我，道长，这世上最难降的妖魔是什么？ 我笑而不...
    开封第一讲书人阅读 54,836评论 1赞 277
  • 港岛之恋（遗憾婚礼）
    正文 为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
    茶点故事阅读 63,833评论 5赞 368
  • 恶毒庶女顶嫁案：这布局不是一般人想出来的
    文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
    开封第一讲书人阅读 48,685评论 1赞 281
  • 城市分裂传说
    那天，我揣着相机与录音，去河边找鬼。 笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。 我是一名探鬼主播，决...
    沈念sama阅读 38,043评论 3赞 399
  • 双鸳鸯连环套：你想象不到人心有多黑
    文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
    开封第一讲书人阅读 36,694评论 0赞 258
  • 万荣杀人案实录
    序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
    沈念sama阅读 42,671评论 1赞 300
  • 护林员之死
    正文 独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,670评论 2赞 321
  • 白月光启示录
    正文 我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,779评论 1赞 332
  • 活死人
    序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
    沈念sama阅读 33,424评论 4赞 321
  • 日本核电站爆炸内幕
    正文 年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
    茶点故事阅读 39,027评论 3赞 307
  • 男人毒药：我在死后第九天来索命
    文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,984评论 0赞 19
  • 一桩弑父案，背后竟有这般阴谋
    文/苍兰香墨 我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,214评论 1赞 260
  • 情欲美人皮
    我被黑心中介骗来泰国打工， 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。 一个月前我还...
    沈念sama阅读 45,108评论 2赞 351
  • 代替公主和亲
    正文 我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
    茶点故事阅读 42,517评论 2赞 343

推荐阅读更多精彩内容