AngularJS -为什么要有多个控制器?
AngularJS - Why have more than one controller
为什么在AngularJS应用程序中有多个控制器?我现在已经构建了一些angular应用程序,我从来没有遇到过我认为多个控制器会让事情变得更容易的问题。
我还是个菜鸟,从来没有写过单元测试,我的代码也不是很好管理,所以我肯定这只是无知。我听说其他人有多个控制器。
换句话说:人们怎么知道他们应该创建一个新的控制器?
在我看来,Angular应用应该为不同的作用域配置不同的控制器。例如,几乎所有应用程序都有用户数据。您将希望将这些数据附加到用户模型中,在用户控制器中:
function UserCtrl ($scope) {
$scope.user = {
name: "bmorrow",
lastLogin: "4/16/2013"
};
}
模板(我们的视图)将位于应用程序结构的特定部分中。例如导航栏的右侧,或者用户详细信息页面。我们通过使用ng-controller
给它分配一个控制器来确定这部分的位置。这将创建上述控制器的scope
并将相应的模型绑定到它。模型(我们的数据)通过控制器连接到视图(HTML)。
假设应用程序有一个用户写文章的页面。我们可以创建另一个控制器,该控制器只局限于专门保存文章内容的HTML部分。
function ArticleCtrl ($scope) {
$scope.article = {
title: "Hello World",
body: "Lorem ipsum...."
};
}
在上面的简单示例中,结合两个控制器不会造成任何损害。但是,一旦应用程序开始增长,根据它所代表的数据在逻辑上组织控制器/视图将使代码更清晰、更容易理解。减少不必要的复杂性将使所有对您来说更容易。使用一个控制器来处理所有事情是不必要的复杂性。
你可以在Basarat的回答中看到这一点。你不一定需要为每条路由使用一个控制器,但这样做有助于从逻辑上构建应用程序。
所以,为了回答你的问题,你通常应该为每一类数据设置一个控制器。用户、物品、水果、蔬菜、交易等。
如果你还没有读过,请阅读Angular控制器和模型-视图-控制器模式以获取更多信息。
当您开始将应用程序拆分为多个视图时,您肯定需要更多的控制器。
。当你开始使用路由(也称为深度链接)时,你有一个模板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'});
}]);
我喜欢把控制器看作"小部件"。在我的后台的一个页面,他们可以打开ViewUsers
控制器(小部件),可以打开更多的UserDetail
控制器。
我猜,如果你习惯了OOP,想要保持它们的作用域分离和封装是很自然的。
- 为什么不't我的变量在我的控制器中填充后在我的视图中呈现
- 为什么ng控制器不调用或工作或功能不工作
- 为什么我的控制器没有启动函数.js脚本
- 在控制器上使用“$watch”时,为什么不更新此隐藏字段
- AngularJS控制器不工作,为什么?(简单的控制器示例)
- 为什么我们将控制器变量设置为等于“0”;这个“;在角度上
- 为什么$scope和'这'关键字在控制器内部可互换使用
- 为什么't我的角度控制器'在其某个方法内的作用域中的依赖项
- 为什么我的角度模板/控制器无法在 ngView 中加载
- 为什么控制器函数没有执行 Angular Js 1.5.5
- 为什么表达式不在角度控制器中动态更新
- 为什么要将控制器声明为自身中的变量或使用$scope
- Ionic Angular/为什么在控制器功能结束之前不调用服务
- 为什么可以't找到控制器/操作路径
- 为什么我以前的按钮不包含控制器的参数?分页列表 MVC
- 为什么在此控制器中无法访问$location
- AngularJS 控制器注入依赖关系 - 为什么构造函数有 []
- 为什么当服务注入第二个控制器时,AngularJS 1.4.8 应用程序不起作用
- 为什么 Angular Hint 建议控制器和模块的帕斯卡大小写名称
- 为什么我在此控制器中得到“未定义$http”