当我使用别名控制器进行测试时,AngularJS 中的 Html 没有改变

Html in AngulaJS does not change when I test with an alias controller

我在 AngularJS 中遇到问题,当我使用控制器的别名

时,要用动态值测试 html div

这是我的代码

<div id="title_contract" class="caption">{{ ctrl.detail_title }}</div>

其中 crtl 是 ContractController 的别名。

我的测试是

    describe('Testing create new or open detail contract', function() {
        var template, ctrl, scope;
        beforeEach(inject(function ($controller, $compile) {
            scope = $rootScope.$new();
            ctrl = $controller('ContractController', {$scope: scope});
            var element = angular.element('<div id="title_contract" class="caption">{{ ctrl.detail_title }}</div>');
            template = $compile(element)(scope);
        }));

        it('should prepare variable to create new contract', function () {
            ctrl.create_clicked();

            scope.$digest();
            var templateAsHtml = template.html();

            expect(templateAsHtml).toContain('New Contract');
        });
    }

我的控制器是

PageApp.controller('ContractController', function($rootScope, $scope ) {

  var vm = this;
  vm.create_clicked       = doCreate;
  vm.title_detail         = '';

  function doCreate() {
     vm.detail_title = 'New Contract';
  }});

当我调用 create_clicked 时,vm 中的标题更改了它的值但测试失败,因为 div 值为空。

我尝试使用 $scope(因此没有别名)并且它有效。 但我想使用别名方法。

有人遇到过这个问题吗? 提前致谢

尝试:

ctrl = $controller('ContractController as ctrl', {$scope: scope});

参见$controller documentation

The string can use the controller as property syntax