Jasmine AngularJs如何访问Controller的属性

时间:2018-10-15 09:51:02

标签: angularjs unit-testing jasmine karma-jasmine angularjs-controller

这是我的AngularJs代码,我想编写一个单元测试,该调用应该在控制器函数内部调用变量和函数。

例如,我希望abcCode是否为toBeDefined();

请让我知道如何加载模块以及如何调用控制器函数(abcCodesCntrl)中的属性。您的建议将非常有帮助。谢谢

功能(){

angular.module('abcapp',[])
    .component('abcCodes', {
        templateUrl: 'app/abcCodes/abcCodes.html',
        controller: abcCodesCntrl
    })
    .config(function ($stateProvider) {
        $stateProvider
            .state('abcCodes', {
                parent: 'home',
                url: 'abcCodes',
                template: '<abc-codes flex layout="column"></abc-codes>',
                data: {
                    label: "abc Codes",
                    icon: 'business',
                    menu: true
                }
            });
    });

/** @ngInject */
function abcCodesCntrl(F $state, abcCodeSvc, $scope, $mdDialog) {
    var ctrl = this;


    ctrl.abcCodes = [];

    ctrl.loadingabcCodes = false;

} }

1 个答案:

答案 0 :(得分:1)

beforeEach(() => {
  angular.mock.module('abcapp');
});

it('pass', inject( $rootScope => {
  const scope = $rootScope.$new();
  const element = angular.element('<abc-codes/>');
  const template = $compile(element)(scope);
  const controller = template.controller('abcCodes');
  expect(controller.abcCodes).toBeDefined();
}))

如果可以使用es6,则控制器将成为类

export class abcCodesCntrl{
  /** @ngInject */
  constructor( $state, abcCodeSvc, $scope, $mdDialog) {
    this.$state = $state;
    this.abcCodeSvc = abcCodeSvc;
    this.$scope = $scope;
    this.$mdDialog = $mdDialog;
    this.abcCodes = [];
    this.loadingabcCodes = false;
  }
}

没有太大的改进,但是您可以测试与指令分离的控制器,这意味着您不需要创建和初始化元素。只需自行测试功能即可。 同样,一旦添加方法,它就会更容易阅读。