角度指令的Jasmine测试失败，因为内部指令没有被编译。为什么不？

Question

这是我的指示：

//Since angular-ui-switch only works for booleans, if you have 0/1 int field, you can use
//this directive (which is just a wrapper around angular-ui-switch) to model the field.
//Use as <int-switch></int-switch>

(function () {
    'use strict';

    angular
        .module('hntb-utils')
        .directive('intSwitch', intSwitch);

    intSwitch.$inject = ['$compile'];

    function intSwitch($compile) {
        return {
            link: link,
            restrict: 'E',
            scope: {
                model: "=ngModel",
                on: '@?',
                off: '@?'
            }
        };

        function link(scope, element, attributes) {
            scope.boolModel = scope.model ? true : false; //{ value: scope.model ? true : false };

            activate();

            function activate() {
                scope.$watch('boolModel', convertToInt);

                scope.on = scope.on || 'On';
                scope.off = scope.off || 'Off';

                var html = '<switch ng-model="boolModel" on="' + scope.on + '" off="' +
                scope.off + '" class="' + attributes.class + '"></switch>';

                element.html(html).show();
                $compile(element.contents())(scope);
            }

            function convertToInt(value) {
                if (arguments.length)
                    scope.model = value ? 1 : 0;
                return scope.model ? true : false;
            }
        }
    }

})();

基本上如评论中所提到的，这是angular-ui-switch的包装。

现在测试：

describe('directive - intSwitch', function () {

    var intSwitchScope,
        intSwitchEl,
        switchEl,
        switchScope;

    beforeEach(function () {
        module('hntb-utils');

        inject(function ($compile, $rootScope) {

            intSwitchScope = $rootScope.$new();
            intSwitchScope.model = false;

            intSwitchEl = $compile('<int-switch ng-model="model"></int-switch>')(intSwitchScope);
            intSwitchScope.$digest();

            switchEl = intSwitchEl.find('switch');
            switchScope = angular.element(switchEl).scope();

        });
    });

    it("Check that ui-switch has been built and is working.", function () {

        var test = switchEl.children();
        switchEl.children()[0].click();
        intSwitchScope.$digest();
        expect(switchScope && switchScope.boolModel == true).toBeTruthy();
    });

    it("Should track boolean model value and replace integers.", function () {

        expect(intSwitchScope.model == 1).toBeTruthy();
        switchEl.children()[0].click();
        intSwitchScope.$digest();
        expect(intSwitchScope.model == 0).toBeTruthy();
    });
});

测试失败：switchEl.children()[0].click();因为switchEl没有任何子节点。 angular-ui-switch指令看起来像：

angular.module('uiSwitch', [])

.directive('switch', function(){
  return {
    restrict: 'AE'
  , replace: true
  , transclude: true
  , template: function(element, attrs) {
      var html = '';
      html += '<span';
      html +=   ' class="switch' + (attrs.class ? ' ' + attrs.class : '') + '"';
      html +=   attrs.ngModel ? ' ng-click="' + attrs.disabled + ' ? ' + attrs.ngModel + ' : ' + attrs.ngModel + '=!' + attrs.ngModel + (attrs.ngChange ? '; ' + attrs.ngChange + '()"' : '"') : '';
      html +=   ' ng-class="{ checked:' + attrs.ngModel + ', disabled:' + attrs.disabled + ' }"';
      html +=   '>';
      html +=   '<small></small>';
      html +=   '<input type="checkbox"';
      html +=     attrs.id ? ' id="' + attrs.id + '"' : '';
      html +=     attrs.name ? ' name="' + attrs.name + '"' : '';
      html +=     attrs.ngModel ? ' ng-model="' + attrs.ngModel + '"' : '';
      html +=     ' style="display:none" />';
      html +=     '<span class="switch-text">'; /*adding new container for switch text*/
      html +=     attrs.on ? '<span class="on">'+attrs.on+'</span>' : ''; /*switch text on value set by user in directive html markup*/
      html +=     attrs.off ? '<span class="off">'+attrs.off + '</span>' : ' ';  /*switch text off value set by user in directive html markup*/
      html += '</span>';
      return html;
    }
  }
});

我在ui-switch的模板功能中放置了一个断点，看起来它没有被执行。我希望在编译我的指令时编译它。我在{-1}}的int-switch链接函数中放置了一个断点，它正在执行。为什么内部指令没有编译？