x.controller与.controller的区别
我有一个主app.js文件，它的定义代码如下所示：
var app = angular.module('Funapp', [
'Funapp.controllers',
'Funapp.services',
])我想知道为什么对于我的js控制器文件，我可以使用app.controller，而另一些我必须编写angular.module(){} etc来代替.controller？app.controller不适用于第二种情况。
例如。app.controller为我的发帖控制器工作。
'use strict';
app.controller('PostsCtrl', function ($scope, Post) { ...etc 但是在工厂等其他js文件中不起作用，所以我必须按下面的方式键入它
'use strict';
angular.module('Funapp.services', [])
.factory('Post', function ($firebase, FIREBASE_URL) {....etc 在post视图或虚拟控制器中也不工作，下面是后置控制器
'use strict';
//angular.module('Funapp') --> Doesnt work currently, neither does Funapp.controller
app.controller('PostViewCtrl', function ($scope, $routeParams, Post) { ...etc 有人能告诉我如何使用app.controller和.controller吗?如果是后者，我应该考虑在angular.module中输入什么(“”，[])？
我读过角度教程，并且理解angular.module(""，[])定义模块，而angular.module("")使用定义的模块。然而，我遇到了很多错误，我无法正确地解决这些问题，也无法理解这些问题是如何工作的。
回答 2
Stack Overflow用户
发布于 2014-07-27 05:10:20
这完全取决于当您到达需要PostViewCtrl的视图时，主应用程序定义文件是否已经加载并处于作用域。如果它已经加载并且对DOM可用，这意味着您可以使用app.controller语法，这显然是因为您已经声明了它和它的依赖项。如果DOM无法使用它，那么您需要做已经在做的事情，从最佳实践的角度来看，这是一个痛苦和可怕的过程。例如，如果您有一个包含应用程序定义的脚本的主页，那么承载在该shell页面中的其他视图可以由app.controller声明控制器，但是如果您有服务器端视图，并且主应用程序定义脚本不包括在母版页( ASP.NET概念)中，那么每当您想要在每个服务器端视图中创建控制器时，都需要重新声明应用程序定义。
例如，假设您有两个页面，Home和About。每个文件中都有单独的控制器定义：app.js如下所示：
var app = angular.module("demoApp", ['demoApp.services']);
var appServices = angular.module('demoApp.services', []);这需要预先加载，并且当您导航到任何其他页面时都需要在其中，因为您的其他页面是同一应用程序的一部分，并且还需要在该应用程序上定义服务。
HomeCtrl.js
app.controller("homeCtrl", function ($scope) {
$scope.msg = "Home!";
});amd AboutCtrl.js
app.controller("aboutCtrl", function ($scope,svc1) {
$scope.msg = "About!";
svc1.sayHi();
});现在在Home.html
<divng-controller="homeCtrl">
<h1>{{msg}}</h1>
</div>和About.html
<script src="~/app/Svc1.js"></script>
<script src="~/app/AboutCtrl.js"></script>
<div ng-controller="aboutCtrl">{{msg}}</p>Svc1.js看起来是这样的：
appServices.service("svc1", function () {
return {
sayHi: function () {
alert("hi");
}
};
});长话短说，当您在应用程序上声明服务或控制器时，引用应用程序模块的app和appServices变量需要在范围内，否则您必须始终重新定义应用程序。
Stack Overflow用户
发布于 2014-07-27 05:25:33
在命名空间中，您的各个对象都处于正确的轨道，需要为每个构造定义模块。
下面是一个例子
<!doctype html>
<html ng-app="Funapp">
<head>
<link rel="stylesheet" type="text/css" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
</head>
<body ng-controller="PostsCtrl">
<div class="well">
<h1>{{message}}</h1>
</div>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.17/angular.min.js"></script>
<script>
angular.module('Funapp.services', [])
.service('PostService', [function () {
return {
doSomething: function() {
return "I posted something";
}
}
}]);
angular.module('Funapp.controllers', ['Funapp.services'])
.controller('PostsCtrl', ['$scope', 'PostService', function ($scope, Post) {
$scope.message = Post.doSomething();
console.log("I'm a Post Controller");
}
]);
angular.module('Funapp', [
'Funapp.controllers'
]);
</script>
</body>
</html>https://stackoverflow.com/questions/24977951
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号