AngularJs获取传递参数方法

AngularJs获取传递参数方法有两种情况，一种是存在路由的情况，一种是普通的情况

1、普通情况下就可以用网上通用的方法来

index.html页面跳转




form demo




点击跳转下一页



点击跳转下一页



var app = angular.module('app', []);
app.controller('myctrl', function($scope,$window) {
$scope.jump = function() {$window.location.href = 'a.html?name=xie&age=25&gender=nv#/query';
}
});

a.html页面获取数据

a.html

var app=angular.module("myapp",[]);
app.config([' $locationProvider', function($locationProvider) {
$locationProvider.html5Mode({ enabled: true, requireBase: false }); }]); app.controller('myctrl', function($scope, $location) { console.log($location.search().name);
console.log( $location.search().age); console.log($location.search().gender);
});
//打印结果：
//[Web浏览器] "xie"
//[Web浏览器] "25"
//[Web浏览器] "nv"

获取url传递过来的参数就可以用$location.search()方法来获取相应的数据
注：上面的代码是来自http://blog.csdn.net/xiejunna/article/details/53789783 的

2、存在路由的情况下，使用上面的方法没有效果，search方法不起作用
需要的参数必须在路由中进行设置

路由中的代码为
app.config([“$stateProvider", function ($stateProvider){
$stateProvider.state(‘Test’, { url: ‘/Test/{name}’, controller: ‘Test_controller’, //controller: function ($stateParams) {//此可以直接得到数据
// alert($stateParams.name)
//},
templateUrl: ‘./views/Test.html’
});
}]);
url也可以写成：url:’/Test/:name’
参数匹配类型：
/Test/{name} 匹配“/Test/任意值”，但不匹配“/Test”,而对“/Test/test1/test2”则认为name=test1/test2
含正则表达式的参数
/Test/{name:[0-9]{1-8}}则会匹配到1到8为的数字，可用此方法来对参数进行约束

index.html页面代码
url测试传递过来的参数

a.html页面的代码
app.controller(‘Test_controller’, function ($scope,$stateParams) {
console.log($stateParams.name);
});

输出结果就是：testname