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