Question

我使用Coffeescript作为我的角度应用程序的脚本和测试语言。 CoffeeScript能够定义我想在我的应用程序中使用的类。我想将从服务器收到的JSON对象包装到实用程序类中。

我们假设我有一个名为＆＃39; dashboard＆＃39;的页面，它显示对象，称为框。所以我有以下控制器：

class DashboardCtrl
  constructor: ->
    @ctrlName = 'DashboardCtrl'
    @boxes = [
      new Box { id: '12344555', name: 'Box 1', rootId: 'box1_rootId' },
      new Box { id: '12344555', name: 'Box 2', rootId: 'box2_rootId' },
      new Box { id: '12344555', name: 'Box 3', rootId: 'box3_rootId' },
      new Box { id: '12344555', name: 'Box 4', rootId: 'box3_rootId' },
      new Box { id: '12344555', name: 'Box 5', rootId: 'box3_rootId' }
    ]

angular
  .module('dashboard')
  .controller 'DashboardCtrl', ['BoxAPI', DashboardCtrl]

应该使用实用程序类＆＃39; Box＆＃39;：

class Box
  constructor: (info) ->
    {@id, @name, @rootId} = info

通过以下单元测试对此进行了测试：

'use strict'

describe 'DashboardCtrl', ->
  ctrl = undefined

  beforeEach module 'dashboard', 'idgApis', 'lib'

  beforeEach inject ($rootScope, $controller) ->
    ctrl = $controller 'DashboardCtrl'

  it 'should load some boxes from the server', ->
    someBox = new Box {id: '12344555', name: 'Box 1', rootId: 'box1_rootId'}
    expect(ctrl.boxes).toContain someBox

导致此输出：

  DashboardCtrl > should load some boxes from the server
        ReferenceError: Can't find variable: Box
            at /home/roman/workspace/idg-frontend/build/app/js/dashboard/dashboard-controller.js:9
            at DashboardCtrl (/home/roman/workspace/idg-frontend/build/app/js/dashboard/dashboard-controller.js:9)
            at invoke (/home/roman/workspace/idg-frontend/bower_components/angular/angular.js:4185)
            at instantiate (/home/roman/workspace/idg-frontend/bower_components/angular/angular.js:4193)
            at /home/roman/workspace/idg-frontend/bower_components/angular/angular.js:8462
            at /home/roman/workspace/idg-frontend/build/test/app/dashboard/dashboard-controller_test.js:14
            at invoke (/home/roman/workspace/idg-frontend/bower_components/angular/angular.js:4185)
            at workFn (/home/roman/workspace/idg-frontend/bower_components/angular-mocks/angular-mocks.js:2364)
            at /home/roman/workspace/idg-frontend/node_modules/karma-jasmine/lib/boot.js:126
            at /home/roman/workspace/idg-frontend/node_modules/karma-jasmine/lib/adapter.js:171
            at http://localhost:9876/karma.js:185
            at http://localhost:9876/context.html:163
        undefined
        TypeError: 'undefined' is not an object (evaluating 'ctrl.boxes')
            at /home/roman/workspace/idg-frontend/build/test/app/dashboard/dashboard-controller_test.js:23
            at /home/roman/workspace/idg-frontend/node_modules/karma-jasmine/lib/boot.js:126
            at /home/roman/workspace/idg-frontend/node_modules/karma-jasmine/lib/adapter.js:171
            at http://localhost:9876/karma.js:185
            at http://localhost:9876/context.html:163

这在Angular中是否可行？如何使实用程序可用？如何使它工作？

Answer 1

首先在你的模块中声明它，例如作为工厂：

angular
  .module 'dashboard'
  .factory 'Box', ->
    class Box
      constructor: (info) ->
        {@id, @name, @rootId} = info

然后在你的测试中你可以注入它：

describe 'DashboardCtrl', ->
  Box = undefined

  beforeEach module 'dashboard'

  beforeEach inject ($injector) ->
    Box = $injector.get 'Box'

现在您可以在it区块中访问它了。

如何在AngularJs中使用Coffeescript实用程序类

1 个答案: