angularjs – 如何动态地将自定义指令添加到div元素？

appDirectives.directive('test',function () {
    return  {
        restrict: 'E',templateUrl: 'templates/test.html'
    }
});

我尝试了这个,但它没有用.我假设模板没有在我附加到div元素之前编译.有角度的方法吗？

<div id="element"></div>

$('#element').append(<test></test>);

更新：这是我正在尝试做的事情.当用户登录我的页面时,我有3个不同的模板,我希望它显示取决于用户的类型.
3个模板是< basic>,< regular>,< advance>
基本上在用户登录后,我将拥有变量user.type的值,并希望为该用户显示相应的模板.

任何建议都会有帮助.谢谢 ：)