AngularJS指令測試

Question

我想測試下面的指令。

angular.module('myModule.directives', []) 
    .directive('test', function() { 
    return { 
     restrictions: 'E', 
     scope: {}, 
     transclude: true, 
     replace: true, 
     template: '<div><ui><li>a</li></ul></div>' 
    } 
}); 

在我的測試：

describe('directives', function() { 
    var compile, 
    scope, 
    test; 

    beforeEach(module('myModule.directives')); 
    beforeEach(inject(function ($compile, $rootScope) { 

    compile = $compile; 
    scope = $rootScope; 
    test = angular.element('<test></test>'); 
    compile(test)(scope); 
    scope.$digest(); 

    it('should render the test directive', function() { 
     var lis = test.find('li'); 
     console.log(lis.length); // should output 1 
    }); 

})); 

測試失敗，輸出0。我很好奇，編譯是否真正做任何事情。如果我有

test = angular.element("<test><li></li></test>");. 

那麼「發現」確實發現測試元件，這正好說明編譯內裏沒有呈現替代測試

'<div><ui><li>a</li></ul></div>' 

，因爲它應該。有任何想法嗎？我看了下面的視頻（http://www.youtube.com/watch?v=rB5b67Cg6bc）。

Answer 1

您需要將「限制」更改爲「限制」