[英]How can I pass down a value in the $scope to an inner controller in AngularJS?
In my angular app.js that's the main controller in my index.html I want to have a function like this: 在我的angular app.js中,我的index.html中的主控制器我希望有这样的函数:
$scope.login = function (user) {
$scope.authenticating = true;
var config = {
method: 'POST',
url: '/api/Account/Login',
data: {
'userName': user.loginUserName,
'password': user.loginPassword,
'rememberMe': user.loginRememberMe
}
};
$http(config)
.success(function (data) {
authentication.isAuthenticated = true;
authentication.userName = user.loginUserName;
localStorage.isAuthenticated = 'yes';
$scope.template = $scope.templates[1];
$state.transitionTo('home');
})
};
In my controllers that are for templates inside index.html I want to be able to get access to the userName. 在我的index.html中的模板控制器中,我希望能够访问userName。 Can someone tell me how I can do this?
谁能告诉我怎么做到这一点? Initially I tried setting $scope.user = {} in the app.js and then setting $scope.user.userName but when I open another template and its controller that's inside app.js the $scope.user does not seem to be visible.
最初我尝试在app.js中设置$ scope.user = {}然后设置$ scope.user.userName但是当我打开另一个模板及其app.js 内的控制器时,$ scope.user似乎不可见。
You could use a service to share data between controllers 您可以使用服务在控制器之间共享数据
app.service('userService', function() {
var user = {};
setUserName = function(name) {
user.name = name;
};
getUser = function(){
return user;
};
});
Controller that sets data 设置数据的控制器
app.controller('FooController', ['$scope', 'userService',
function ($scope, userService) {
$scope.login = function (user) {
$scope.authenticating = true;
var config = {
method: 'POST',
url: '/api/Account/Login',
data: {
'userName': user.loginUserName,
'password': user.loginPassword,
'rememberMe': user.loginRememberMe
}
};
$http(config)
.success(function (data) {
authentication.isAuthenticated = true;
userService.setUserName(user.loginUserName);
localStorage.isAuthenticated = 'yes';
$scope.template = $scope.templates[1];
$state.transitionTo('home');
})
};
}
]);
Other Controller, that retrieves data 其他控制器,用于检索数据
app.controller('BarController', ['$scope', 'userService', function($scope, userService) {
var username = userService.getUser().name
});
Since your retrieval is async, you might need to add some event/callback mechanism to your user service, so the controllers get notified when the name is set / changes. 由于您的检索是异步的,您可能需要向用户服务添加一些事件/回调机制,以便在设置/更改名称时通知控制器。
All child controllers inherit $scope
variables from parents 所有子控制器都从父级继承
$scope
变量
<div ng-controller="c1">
<div ng-controller="c2"></div>
</div>
youApp.controller('c1', ['$scope', function($scope){
$scope.blabla = 1;
}]);
youApp.controller('c2', ['$scope', function($scope){
// $scope.blabla is also 1 here because c2 is a child of c1
}]);
You can store anydata in built-in $rootScope
service. 您可以在内置
$rootScope
服务中存储任何数据。 Services are singleton in Angular 服务是Angular中的单身人士
yourApp.run(['$rootScope', functin($rootScope){
$rootScope.foo = 'bar';
// you can inject $rootScope in any controller you want and use $rootScope.foo
}]);
As @Robin suggest, I also recommend to write your own service for authorization 正如@Robin建议的那样,我还建议您编写自己的服务以进行授权
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.