javascript AngularJS - 为什么有多个控制器
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/16073536/
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
AngularJS - Why have more than one controller
提问by Kevin Beal
What reasons are there to have multiple controllers in an AngularJS application? I've built a few angular apps now and I've never encountered a problem where I thought multiple controllers would make things easier for me.
在 AngularJS 应用程序中有多个控制器的原因是什么?我现在已经构建了一些 Angular 应用程序,而且我从未遇到过我认为多个控制器会让事情变得更容易的问题。
I'm still a bit of a n00b, have never written a unit test and my code isn't as manageable as it could be so I'm sure it's just ignorance. And I've heard that other people have multiple controllers.
我仍然有点像 n00b,从来没有写过单元测试,我的代码也不像它可能的那样易于管理,所以我确定这只是无知。我听说其他人有多个控制器。
Put another way: how does one know that they should create a new controller?
换句话说:人们怎么知道他们应该创建一个新的控制器?
采纳答案by Brent Morrow
From what I've seen of it an Angular application should have separate controllers for separate scopes. For instance, almost all applications have user data. You'll want to have this data attached to a user model, inside a user controller:
从我所看到的角度来看,Angular 应用程序应该为不同的范围提供单独的控制器。例如,几乎所有的应用程序都有用户数据。您需要将此数据附加到用户模型中的用户控制器中:
function UserCtrl ($scope) {
$scope.user = {
name: "bmorrow",
lastLogin: "4/16/2013"
};
}
And the template (our view) will be inside a specific portion of the applications structure. The right side of a navigation bar for example, or on a user details page. We establish where this portion is by assigning it a controller using ng-controller
. This creates the scope
of said controller and binds the corresponding models to it. The model (our data) is connected to the view (the HTML) via the controller.
模板(我们的视图)将位于应用程序结构的特定部分内。例如,导航栏的右侧,或在用户详细信息页面上。我们通过使用 为它分配一个控制器来确定这部分的位置ng-controller
。这将创建scope
所述控制器的 并将相应的模型绑定到它。模型(我们的数据)通过控制器连接到视图(HTML)。
Suppose the application has a page for the user's written articles. We can create another controller restricted only to the section of HTML that specifically holds the article content.
假设应用程序有一个页面供用户撰写文章。我们可以创建另一个仅限于专门保存文章内容的 HTML 部分的控制器。
function ArticleCtrl ($scope) {
$scope.article = {
title: "Hello World",
body: "Lorem ipsum...."
};
}
In the trivial example above, combining both of the controllers won't do any harm. But once your application begins to grow, logically organizing your controllers/views according to the data it represents will make your code cleaner and easier to understand. Less unneeded complexity will make everythingmuch easier on you. And using one controller for everything is an unneeded complexity.
在上面的简单示例中,组合两个控制器不会造成任何伤害。但是一旦你的应用程序开始增长,根据它代表的数据逻辑地组织你的控制器/视图将使你的代码更清晰、更容易理解。减少不必要的复杂性将使您的一切变得更容易。对所有事情使用一个控制器是一种不必要的复杂性。
You can see this illustrated in Basarat's answer as well. You don't necessarily need to use one controller per route, but doing so helps to logically structure the application.
您也可以在 Basarat 的回答中看到这一点。您不一定需要为每个路由使用一个控制器,但这样做有助于在逻辑上构建应用程序。
So, to answer your question, you should usually have one controller per category of data. Users, Articles, Fruits, Vegetables, Transactions, and so on.
因此,要回答您的问题,您通常应该为每个数据类别设置一个控制器。用户、文章、水果、蔬菜、交易等。
Read about Angular Controllersand the Model-View-Controllerpattern for more information if you haven't already. I hope this helps.
如果您还没有了解更多信息,请阅读Angular Controllers和Model-View-Controller模式。我希望这有帮助。
回答by basarat
You definitely start to need more controllers when you start to split you application into multiple views.
当您开始将应用程序拆分为多个视图时,您肯定会开始需要更多控制器。
e.g. When you start to use routes (also called deep linking) you have a template url as well as a controller to go with that template (check out http://docs.angularjs.org/tutorial/step_07) e.g.
例如,当您开始使用路由(也称为深度链接)时,您有一个模板 url 以及一个与该模板配合使用的控制器(查看http://docs.angularjs.org/tutorial/step_07)例如
angular.module('phonecat', []).
config(['$routeProvider', function($routeProvider) {
$routeProvider.
when('/phones', {templateUrl: 'partials/phone-list.html', controller: PhoneListCtrl}).
when('/phones/:phoneId', {templateUrl: 'partials/phone-detail.html', controller: PhoneDetailCtrl}).
otherwise({redirectTo: '/phones'});
}]);
回答by Keith
I like to think as controllers as "widgets." One one page of my backend, they can open up the ViewUsers
controller (widget), which can open up more UserDetail
controllers.
我喜欢将控制器视为“小部件”。我的后台一页一页,他们可以打开ViewUsers
控制器(widget),可以打开更多的UserDetail
控制器。
I guess if you're used to OOP, it feels pretty natural to want to keep their scopes separate and encapsulated.
我想如果您习惯了 OOP,那么希望将它们的作用域分开并封装起来会感觉很自然。