学习中的一些小知识_storagesetter-CSDN博客

本文链接：https://blog.csdn.net/cainiao0314/article/details/73497667

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}"