Question

一位同事找到了一份指南，显然是来自谷歌：

https://google-styleguide.googlecode.com/svn/trunk/angularjs-google-style.html

阅读本文时，基于我对过去6个月的角度的使用，我有一些顾虑（我在Rails中使用Angular + Coffee，偶尔使用Haml页面）：

该文档似乎建议使用类。

我有一个PITA处理代码依赖于JS'this'设置为任何理智（你可以利用它来调用类方法）。这在回调中尤其痛苦。

我的工作是将所有方法都绑定到$ scope，并确保所有控制器代码都位于1个词法范围内，例如：

MyController = ($scope) ->
  $scope.my_callback= ->
    # do something useful, $scope is set to 'the right thing', and don't care about 'this'.

与为控制器创建类

class MyController
  constructor: (@$scope) ->

  callback: ->
    # @ is in the hands of the caller...

咖啡 - ＆gt; JS产生：

var MyController;    
MyController = (function() {
  function MyController($scope) {
    this.$scope = $scope;
  }    
  MyController.prototype.callback = function() {};    
  return MyController;    
})();

请注意，$ scope不在'callback'的词汇上下文中，其中： a）意味着你无法挂上帽子，并且 b）coffeescript代码有点令人困惑......如果方法不是类方法，范围就在上下文中：（

推广全球名称。

该doc似乎建议使用谷歌闭包库goog.require / provide组合。虽然这些是很好的包装器，但它们确实有效地生成了JS全局变量（带有'名称间距'）。另一种方法是将所有内容包装在一个函数中（在coffeescript中只需要将事物放在一个单独的文件中），并且只将相关项“发布”为angular作为指令，服务，控制器或不是。这可以避免将任何全局变量放入JS命名空间。

所以...说完所有：

a）我可以看到controller == class在你有控制器类层次结构的情况下很有用，所以你可以使用子类。但你真的会这样做吗？你不会把任何常见的逻辑分解成库或服务吗？是否有“这个”“浮动”而没有'$ scope'值得的痛苦？

b）有没有理由将控制器/指令等代码推送到全局JS命名空间？

（p.s不打算在这里发起宗教战争，但我可以忍受这种情况;）

Answer 1

mm ..我在控制器中与CoffeeScript类作了一段时间的斗争，但是同时尝试学习Angular指令/范围/等是灾难的一种方法..我真的没有必要使用它们，所以我放弃了它。 Desty的食谱看起来不错，但我不认为我已经迷上了那个咕噜咕噜的注释器会处理这种格式。

他们确实非常整洁地进入了服务..

angular.module('app')

.factory 'AccountsService', (UserService, AccountsResource, UtilService, $log) ->
  new class
    constructor: ->
      @account = null
      @accounts = []

    save: (account) ->
      res = new AccountsResource(account)
      res.$save()

Answer 2

使用CoffeeScript的Angular控制器和服务类是一个好主意，因为代码干净且易读。继承是可能的，但我从未测试过它。如果以Angular方式初始化控制器和服务，则不应该遇到全局变量问题。

this的问题通常可以使用CoffeeScript中的fat arrow =>来解决。

我的控制器看起来如下（使用controller as时）：

angular.module 'myapp.controller', []
.controller 'MyController', [ '$scope',
    class
        constructor: (@$scope) ->
            @attribute = null
            @$scope.$on 'anEvent', (event, data) => @attribute = data

        getValue: ->
            return @attribute
]

角度风格指南 - 与Coffeescript？

2 个答案: