AngularJS中控制器的责任 - 超过两个视图?

时间:2014-04-05 23:42:11

标签: angularjs angularjs-routing

我来自Rails世界,控制器负责执行业务逻辑,但单个控制器可以呈现多个视图,具体取决于应该执行的操作。

然而,在对AngularJS进行一些研究之后,我感觉控制器只有一个责任(与单个视图相关联)。因此,例如,如果我们有一个列出餐馆的应用程序,我们将拥有以下内容:

@restauranteur.config(['$routeProvider', ($routeProvider) ->
  $routeProvider.
    when('/restaurants', {
      templateUrl: '../templates/restaurants/index.html',
      controller: 'RestaurantIndexCtrl'
    }).
    when('/restaurants/:id', {
      templateUrl: '../templates/restaurants/show.html',
      controller: 'RestaurantShowCtrl'
    }).
    otherwise({
      templateUrl: '../templates/home.html',
      controller: 'HomeCtrl'
    })
])

一个控制器将用于'索引',另一个控制器用于'show'。这是Angular中正确的方法/建议方法吗?

1 个答案:

答案 0 :(得分:6)

正如您可以在官方文档中看到的那样,一般来说,控制器不应该尝试做太多。它应该只包含单个视图所需的业务逻辑。

保持控制器变瘦的最常用方法是将不属于控制器的工作封装到服务中,然后通过依赖注入在控制器中使用这些服务。

在Angular中,Controller是一个JavaScript构造函数,用于扩充Angular Scope。

当Controller通过ng-controller指令附加到DOM时,Angular将使用指定的Controller的构造函数实例化一个新的Controller对象。新的子作用域将作为$ scope的构造函数的可注入参数提供。

使用控制器:

  • 设置$ scope对象的初始状态。
  • 向$ scope对象添加行为。

请勿使用控制器:

  • 操纵DOM - 控制器应仅包含业务逻辑。将任何表示逻辑放入控制器会显着影响其可测试性。 Angular对大多数情况和指令进行数据绑定以封装手动DOM操作。
  • 格式输入 - 改为使用角度形式控件。
  • 滤镜输出 - 改为使用角度滤镜。
  • 跨控制器共享代码或状态 - 改为使用角度服务。
  • 管理其他组件的生命周期(例如,创建服务实例)。

很快回答你的问题 - 是的,这是正确的方法