zoukankan      html  css  js  c++  java
  • 通过路由url携带参数进行参数传递

    一、url解析参数

    在路由中写入,同一个控制器,同一个页面模板,可以写多个路由,不同的路由对应相同的页面,只是在这种传参数的状态下的特定页面。

     .state("OrderRecord", {
          parent: "ServiceManage",
          url: "/order-record",
          templateUrl: "partials/service/transaction/order-record.html",
          controller: "OrderRecordCtrl"
      })
      .state("OrderRecordQuery", {
          parent: "ServiceManage",
          // params: {"orderStatus":null},
          url: "/order-record/orderStatus/?:orderStatus/:startTime/:endTime",
          templateUrl: "partials/service/transaction/order-record.html",
          controller: "OrderRecordCtrl"
      })

    在模板里,再跳转的ui-sref里的写的是state的状态,增加target,新开页。

     <div class="link-num-mar">
                    <a class="link-num" ng-class="{'un-click':main.newOrdersCnt===0}" ui-sref="OrderRecordQuery({orderStatus: main.orderQueryParam.orderStatus,startTime: main.orderQueryParam.startTime,endTime:main.orderQueryParam.endTime})" target="_blank">
                        {{main.newOrdersCnt}}
                    </a>
                </div>

    PS:1、ng-class是针对于后端返回的数值,如果数值为0,不可点击的需求。不可点击使用属性pointer-event:none。

    在目的地页面控制器js里进行url解析,在初始化的时候,进行解析

     function init() {
            if($scope.url.indexOf('orderStatus')>=0){
                $scope.orderParam.orderStatus = $scope.url.split('=')[1].split('&')[0];
                $scope.orderParam.startTime = $scope.url.split('=')[2].split('&')[0];
                $scope.orderParam.endTime = $scope.url.split('=')[3].split('&')[0];
                $scope.startTime = $scope.url.split('=')[2].split('&')[0];
                $scope.endTime = $scope.url.split('=')[3].split('&')[0];
                // console.log($scope.orderParam.endTime);
                $scope.orderParam.pageSize=$scope.pageSize;
                $scope.orderParam.pageNumber=$scope.pageNumber;
                TransactionService.getAllOrderCase($scope.orderParam).then(function(result) {
                    $scope.orderRecords = result.datas;
                    $scope.totalCount = result.totalDataCount;
                    $scope.totalOrder = result.totalDataCount;
                });
            }else{
                $scope.orderParam.pageSize=$scope.pageSize;
                $scope.orderParam.pageNumber=$scope.pageNumber;
                TransactionService.getAllOrderCase($scope.orderParam).then(function (result) {
                    $scope.orderRecords = result.datas;
                    $scope.totalCount = result.totalDataCount;
                    $scope.totalOrder = result.totalDataCount;
                });
            }
        };

    PS:1、通过url中是否传了传的标志位orderStatus,函数indexof('orderStatus')>=0,表示含有这个标志位

    2、split函数,对字符串进行分割,split('='),从字符串从左至右的第一个‘=’进行分割,分成数组,如果有1个‘=’就是分成两个数组,‘=’之后为一个数组,‘=’之前包括‘=’为一个数组,split('=')[1],表示取‘=’之后的数组,因为js数组初始值从0开始。

  • 相关阅读:
    hdu 1116 Play on Words
    hdu 1856 More is better
    跟随鼠标跑
    asp.net实现数据流文件下载
    在ASP.NET程序中集成更好的下载体验
    request.ContentType的可取值
    multipart formdata boundary 说明
    ASP.NET中实现多文件上传(普通)
    读取XML文件中的某个节点的某个属性
    获取请求的Headers部分
  • 原文地址:https://www.cnblogs.com/chengxs/p/8065837.html
Copyright © 2011-2022 走看看