控制器之间Angularjs共享方法 [英] Angularjs sharing methods between controllers
问题描述
我在读 角上的验证和认为这将是很好的在自己的项目中使用。它的工作真的很好，我想在形式验证成功在其他控制器访问它方法来扩展。我试着这样做的各种方式，但我似乎无法看到在$范围对象的方法。
I was reading this article on Angular validation and thought it would be good to use in my own project. It's working really well and I'd like to extend it accessing methods in other controllers upon successful validation of the form. I've tried various ways of doing this but I can't seem to see the methods in the $scope object.
<!DOCTYPE html>
<html>
<head>
<link data-require="bootstrap-css@3.0.0"
data-semver="3.0.0"
rel="stylesheet"
href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" />
<script data-require="angular.js@1.0.8"
data-semver="1.0.8"
src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script>
<script src="rcSubmit.js"></script>
<script src="loginController.js"></script>
<script src="loginApp.js"></script>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-6 col-sm-offset-3">
<h1>Simple Login Form</h1>
<form name="loginForm" novalidate
ng-app="LoginApp" ng-controller="LoginController"
rc-submit="login()">
<div class="form-group"
ng-class="{'has-error': rc.loginForm.needsAttention(loginForm.username)}">
<input class="form-control" name="username" type="text"
placeholder="Username" required ng-model="session.username" />
<span class="help-block"
ng-show="loginForm.username.$error.required">Required</span>
</div>
<div class="form-group"
ng-class="{'has-error': rc.loginForm.needsAttention(loginForm.password)}">
<input class="form-control" name="password" type="password"
placeholder="Password" required ng-model="session.password" />
<span class="help-block"
ng-show="loginForm.password.$error.required">Required</span>
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary pull-right"
value="Login" title="Login">
<span>Login</span>
</button>
</div>
</form>
</div>
</div>
</div>
</body>
</html>
我希望有人能告诉我什么，我缺少的，为了使这项工作。我一个分叉 plunkr 。
推荐答案
正确的方式做，这将与角度的服务。例如：
The proper way to do this would be with an angular service. For example:
app.factory('svc', function () {
var msg="original...";
return {
setMessage: function(x) {
msg=x;
},
getMessage: function() {
return msg;
}
};
});
这样，您就可以访问内部的类函数SVC 在你注入 SVC 到任何控制器：
This way you can access the fucntions inside svc in any controller that you inject svc into:
app.controller("ctrl1",function($scope,svc,$timeout){
$scope.someText=svc.getMessage();
$scope.$watch("someText",function(v){
svc.setMessage(v);
});
});
app.controller("ctrl2",function($scope,svc){
$scope.msg=svc.getMessage();
$scope.$watch(svc.getMessage,function(v){
$scope.msg=v;
});
});
请参阅这个演示普拉克（我忽略了你一掷提供的，因为它有一个很大的噪音）。
See this demo plunk (I ignored that plunk you provided because it had a lot of noise).
修改
执行服务的方法和形式验证是不是真的彼此相关的，看到普拉克。
Executing the service method and form validation are not really related to each other, see plunk.
修改
如果你想使用的服务或一个应用程序的控制器内的另一个，只需引用您的主应用程序的依赖关系，并调用你的第二个应用程序内的主应用程序中定义的服务。如果你的主要应用程序被称为 demoApp1 ，那么你可以创建一个名为另一个应用程序 dempApp2 和参考 demoApp1 在 demoApp2 ，并使用 demoApp1 定义的任何服务在 demoApp2 。见我已经更新它证明你问什么普拉克。
If you want to use the services or controllers of one app inside another, just reference the dependencies in your main app and call the services defined in your main app inside your second app. If your main app is called demoApp1, then you could create another app called dempApp2 and reference demoApp1 in demoApp2 and use any services defined in demoApp1 inside demoApp2. See the plunk I've updated it to demonstrate what you're asking.
这篇关于控制器之间Angularjs共享方法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
