学习中的一些小知识

来源：互联网发布：网络继续教育编辑：程序博客网时间：2024/04/30 11:01

1.splice

1.作用：删除用法：arr.splice(index,1);//删除index，删除的个数是“1”；2.作用：替换用法：arr.splice(index,1，"p");//用p替换index的值

2.页面百分比设置

    <div style="height:10%;"></div>

3.Angularjs默认时间控件

<input class="achieven_quinput" type="date"/>onchange="angular.element(this).scope().judgeDate()"

4.时间函数应用

    var startime = "";    var endtime = "";    var strstar = "";    var strend = "";    var startime_o = "";    var endtime_o = "";    $scope.judgeDate=function(a){         startime = document.getElementById('startime').value;//获取页面中的起始时间：2017-1-1         endtime = document.getElementById('endtime').value;.//获取页面中的终止时间：2017-1-11         strstar = startime.split("-");//将时间变为[2017,1,1]去掉“-”         strend = endtime.split("-");         startime_o = Date.parse(strstar);//将时间[2017,1,1]变为一串Number类型的数字         endtime_o = Date.parse(strend);        if(a==1){            if(startime_o>endtime_o){                //如果终止时间小于起始时间则让终止时间=起始时间                document.getElementById('endtime').value=startime;            }        }        if(a==2){            if(startime_o>endtime_o){                //如果终止时间小于起始时间则让起始时间=终止时间                document.getElementById('startime').value=endtime;            }        }    }    //点击查询    var buyTime = "";    var strbuy = "";    var buyTime_o = "";    $scope.guarashow1 = false;    $scope.judgecheck=function(){        $scope.guarantee = [            {"id":"7","insuranceName":"金色夕阳老人意外保险","insuranceMark":"骨折走失双保险","startTime":"2017-1-11 00.00","price":"44","startage":"60","endage":"80","buyTime":"2017-1-11"},            {"id":"8","insuranceName":"旅游意外保险","insuranceMark":"交通意外双倍赔付","startTime":"2017-1-11 00.00","price":"66","startage":"18","endage":"80","buyTime":"2017-1-1"},            {"id":"9","insuranceName":"家有儿女少儿保险","insuranceMark":"少儿走失保障","startTime":"2017-1-11 00.00","price":"74","startage":"0","endage":"18","buyTime":"2017-2-11"}        ];        var buyTimearr=new Array();        for(var i = 0;i<$scope.guarantee.length;i++){            buyTime = $scope.guarantee[i].buyTime;            strbuy = buyTime.split("-");            buyTime_o = Date.parse(strbuy);            if(buyTime_o>=startime_o && buyTime_o<=endtime_o){                //$scope.guarashow1= true;                buyTimearr.push($scope.guarantee[i]);//将符合时间条件的数组放入新的数组中            }        }        if(buyTimearr.length!=0){           $scope.guarantee=buyTimearr;//将新的数组重新ng-repeat        $scope.guarashow1= true;//将新的数组展示出来ng-show        }else{            $scope.alertModal("没有查询到信息");        }    }

注意：

Date.parse()函数的返回值为Number类型，返回该字符串所表示的日期与 1970 年 1 月 1 日午夜之间相差的毫秒数。

for循环容易出现的错误：只显示最后一次的循环结果，处理方法就是将想要的结果结果重新存储，在for循环外面进行处理。

split() 方法用于把一个字符串分割成字符串数组。例如1：”2:3:4:5”.split(“:”) //将返回[“2”, “3”, “4”, “5”]；例如2：”|a|b|c”.split(“|”) //将返回[“”, “a”, “b”, “c”]

5.过滤器：filter

1.在模板中使用filter

我们可以直接在{{}}中使用filter，跟在表达式后面用 | 分割，语法如下：{{ expression | filter }}

也可以多个filter连用，上一个filter的输出将作为下一个filter的输入（怪不得这货长的跟管道一个样。。）{{ expression | filter1 | filter2 | … }}

filter可以接收参数，参数用 : 进行分割，如下：{{ expression | filter:argument1:argument2:… }}

除了对{{}}中的数据进行格式化，我们还可以在指令中使用filter，例如先对数组array进行过滤处理，然后再循环输出：

2.在controller和service中使用filter

我们的js代码中也可以使用过滤器，方式就是我们熟悉的依赖注入，例如我要在controller中使currency过滤器，只需将它注入到该controller中即可，代码如下：

 app.controller('testC',function($scope,currencyFilter){        $scope.num = currencyFilter(123534);     }

在模板中使用{{num}}就可以直接输出$123,534.00了！在服务中使用filter也是同样的道理。

在controller中使用多个filter，只需注入一个$filter就够了，使用方法如下：

 app.controller('testC',function($scope,$filter){    $scope.num = $filter('currency')(123534);    $scope.date = $filter('date')(new Date());   }

可以达到同样的效果。好处是你可以方便使用不同的filter了。

案例

 在HTML页面中： <input id="search_inp" type="text" placeholder="查询内容" value="" ng-model="search" ng-change="achsearch()"> <table class="table" style="position: relative;top: 5px;left: 10px" ng-show="productsname">       <tbody>           <tr style="height: 25px;line-height: 25px;position: relative;left: 10px" ng-repeat="product in products | filter:search">               <td style="padding-bottom: 10px">                   {{product.shopName}}               </td>           </tr>       </tbody> </table> //js页面中 $scope.productsname=false; $scope.achsearch=function(){        $scope.search_inp=document.getElementById("search_inp");        if($scope.search_inp.value==""){            $scope.productsname=false;        }        else{            $scope.productsname=true;        }    }

注意：
ng-model=”search” 必不可少哦！

6.js存储数据

localStorage - 没有时间限制的数据存储。第二天、第二周或下一年之后，数据依然可用。

sessionStorage 方法针对一个 session 进行数据存储。当用户关闭浏览器窗口后，数据会被删除。

方法:Window.prototype.sessionStorage = 0;Window.prototype.localStorage = 0;

   sessionStorage.getItem(key)-----------获取指定key的本地存储值   sessionStorage.setItem(key)-----------将value值存储到key字段中   sessionStorage.removeItem(key)--------删除指定key的本地存储的值

工具类：UtilsBonc   功能说明：调用方式 UtilsBonc.StorageGetter(key)                                         UtilsBonc.StorageSetter(key,val)     var UtilsBonc = (function () {       var StorageGetter = function (key) {          return localStorage.getItem(key);         }        var StorageSetter = function (key, val) {          return localStorage.setItem(key, val);         }        return {          StorageGetter:StorageGetter,          StorageSetter:StorageSetter         }     })();    调用UtilsBonc.StorageSetter将变量的值set存储起来       var setParam={            operatorCode: $scope.operatorCode,            proposalNo: $scope.proposalNo,            relationFlag: $scope.relationFlag,            relationNo: $scope.relationNo,            signModul:$scope.signModul,        };        UtilsBonc.StorageSetter("modulPames", JSON.stringify(setParam));调用get方法根据key值获取到存储的值并赋值给变量      var value1 = UtilsBonc.StorageGetter("modulPames");       var request_pams = JSON.parse(value1);// JSON.parse是从一个字符串中解析出JSON对象      if (value1 != null && value1 != "") {            $scope.role = request_pams.role;            $scope.operatorCode = request_pams.operatorCode;            $scope.proposalNo = request_pams.proposalNo;            $scope.relationFlag = request_pams.relationFlag;            $scope.relationNo = request_pams.relationNo;            $scope.signModul = request_pams.signModul;        }

7.json.parse()和json.stringify()

json.parse()方法用于从一个字符串中解析出JSON对象；eg:   var str='{"name":"huahua","age":"32"}'      JSON.parse(str) 结果： age:"32"       name:"huahua"

注意：单引号写在{}外，每个属性名都必须用双引号，否则会抛出异常。

json.stringify()用于从一个对象解析出字符串；eg:   var a = {a:1,b:2}      JSON.stringify(a) 结果："{"a":1,"b":2}"

阅读全文

0 0