AngularJS 不同页面之间的传参

1、基于ui-router传参

① 定义的跳转路由中：

.state('faceWarning',{
            url: '/faceWarning',
            templateUrl: 'pages/face/faceWarning.html',
            controller: 'WarningCtrl'
        })
.state('faceWarningList',{
            url: '/faceWarningList/:groupId',
            templateUrl: 'pages/face/faceWarningList.html',
            controller: 'WarningListCtrl'
        })

②传参的页面html中

ng-click="jumpWarningList(data.groupId)"
定义页面跳转函数 (使用ui-router的$state.go接口)：

faceApp.controller('WarningCtrl', ['$rootScope', '$scope', '$state',
    function($rootScope, $scope, $state) {
         $scope.jumpWarningList = function(groupId) {
            $state.go('faceWarningList', {groupId: groupId});
        };
  }]);

对于a链接跳转，对于angularjs 则在页面中

③接受的页面js中，通过ui-router的$stateParams获取参数groupId

faceApp.controller('WarningCtrl', ['$rootScope', '$scope', '$stateParams',
    function($rootScope, $scope, $stateParams) {
         $scope.searchSpecial.groupId = $stateParams.groupId;
  }]);

这种跳转，在不传递参数时，url: '/faceWarningList/:groupId', 这里将会影响单独跳转的实现，导致点击无效。

如果要实现单独点击跳转（主页面不带参数跳转），需要在app.js中定义参数，不然$state.go在传输之后在目标controller接受的时候会被filter过滤掉

.state('faceWarningList',{
            url: '/faceWarningList',
            templateUrl: 'pages/face/faceWarningList.html',
            params: {'groupId': null},
            controller: 'WarningListCtrl'
        })

https://www.cnblogs.com/miny-simp/p/7910069.html

 

2、angular获取通过链接形式访问的页面，要获取url中的参数，就不能通过路由的方式传递获取。应该使用$location获取url值，通过url传参

var para=$location.$$search["para"]

// 带#号的url，看？号的url，见下面  
url = http://qiaole.sinaapp.com?#name=cccccc  
  
$location.absUrl();  
// http://qiaole.sinaapp.com?#name=cccccc  
  
$location.host();  
// qiaole.sinaapp.com  
  
$location.port();  
// 80  
  
$location.protocol();  
// http  
  
$location.url();  
// ?#name=cccccc  
  
// 获取url参数  
$location.search().name;  
// or  
$location.search()['name'];  
  
// 注：如果是这样的地址：http://qiaole.sinaapp.com?name=cccccc  
  
var searchApp = angular.module('searchApp', []);  
searchApp.config(['$locationProvider', function($locationProvider) {  
  $locationProvider.html5Mode(true);  
}]);  
searchApp.controller('MainCtrl', ['$scope', '$location', function($scope, $location) {  
  if ($location.search().keyword) {  
    $scope.keyword = $location.search().keyword;  
  }  
}]);

https://www.cnblogs.com/xyyt/p/6991837.html

3、a链接跳转传参

html页面

<a href="#/faceWarningList/{{groupId}}" ng-click="groupId = 1">

路由配置

.state('faceWarningList',{
            url: '/faceWarningList/:groupId',
            templateUrl: 'pages/face/faceWarningList.html',
            controller: 'WarningListCtrl'
        })

在跳转过去的页面中，只能用html原生方法获取url值并解析

var locationUrl = windows.location.href;
var groupId = locationUrl.slice(-1);