Javascript Angular:将参数从 $routeProvider 传递给控制器
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/27533386/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Angular: Passing params from $routeProvider to controller
提问by K. D.
I have multiple routes that invoke the same Controller and I would like to pass different variables to it.
我有多个调用同一个控制器的路由,我想将不同的变量传递给它。
// Example
$routeProvider.
when('/a', {
templateUrl: 'test.html',
controller: 'MyController' // should get passed 'exampleA'
}).
when('/b', {
templateUrl: 'test.html',
controller: 'MyController' // should get passed 'exampleB'
});
I know that I could use the "resolve" object:
我知道我可以使用“解决”对象:
$routeProvider.
when('/a', {
templateUrl: 'test.html',
controller: 'MyController',
resolve: {test: function() { return true; }}
});
To pass a value as a dependency:
将值作为依赖项传递:
app.controller('MyController', ['$scope', 'test', function ($scope, test) {
console.log(test); // true
}
My problem with that approach is that my app crashes if the resolve object is missing on other routes and I would like to pass optional params.
我对这种方法的问题是,如果其他路由上缺少解析对象,并且我想传递可选参数,我的应用程序就会崩溃。
Is there any way to pass specific params to the Controller (from the route provider)?
有没有办法将特定参数传递给控制器(来自路由提供者)?
Thank you
谢谢
回答by Aidin
Routing:
路由:
$routeProvider.
when('/a', {
templateUrl: 'test.html',
controller: 'MyController',
paramExample: 'exampleA'
}).
when('/b', {
templateUrl: 'test.html',
controller: 'MyController',
paramExample: 'exampleB'
});
Access: inject $route in your controller then use this
访问:在您的控制器中注入 $route 然后使用它
app.controller('MyController', ['$scope', '$route', function ($scope, $route) {
var paramValue = $route.current.$$route.paramExample;
console.log(paramValue);
}
回答by Wayne Ellery
You can use resolve and $route.currrent.params.testto pass the parameter like this:
您可以使用 resolve 并$route.currrent.params.test像这样传递参数:
$routeProvider
.when('/a', {
templateUrl: 'view.html',
controller: 'MainCtrl',
resolve: {
test: function ($route) { $route.current.params.test = true; }
}
})
.when('/b', {
templateUrl: 'view.html',
controller: 'MainCtrl',
resolve: {
test: function ($route) { $route.current.params.test = false; }
}
})
Then in your controller you can access it from the $routeParams:
然后在您的控制器中,您可以从 $routeParams 访问它:
app.controller('MainCtrl', function($scope, $routeParams) {
$scope.test = $routeParams.test;
})
回答by wvdz
The most natural way to do this is doing what you would normally do when you want to load a page with parameters: use query parameters: http://yoururl.com?param1=value¶m2=value
最自然的方法是执行您想要加载带有参数的页面时通常会执行的操作:使用查询参数: http://yoururl.com?param1=value¶m2=value
ngRoute comes with the service $routeParams which you can inject in your controller. Now you can simply retrieve the values like this $routeParams.param1.
ngRoute 附带服务 $routeParams,您可以将其注入控制器。现在您可以简单地检索这样的值$routeParams.param1。
Another way to do this is to retrieve the path with $location.pathand set the variable there.
另一种方法是检索路径$location.path并在那里设置变量。
回答by Amay Kulkarni
using $routeParams
使用 $routeParams
in Main js file
在主js文件中
routeApp.config(function($routeProvider) {
$routeProvider
.when('/home', {
templateUrl: '../sites/./home.html',
controller: 'StudentController'
})
.when('/viewStudents/:param1/:param2', {
templateUrl: '../sites/./viewStudents.html',
controller: 'StudentController'
})
.otherwise({
redirectTo: '/'
});
});
routeApp.controller('StudentController',['$filter','$routeParams', '$location',function($filter,$routeParams,$location){
var StudentCtrl = this;
StudentCtrl.param1 = $routeParams.param1;
StudentCtrl.param2 = $routeParams.param2;
}]);
calling from Home.html
从 Home.html 调用
<div class="container">
<h2> Welcome </h2>
<a href="#/viewStudents/myname/somevalue2">Students</a>
</div>

