AngularJS-将模型中的字符串注入HTML的标记名称

Question

是否可以将字符串插入带有角度的html的标签名称中？

像这样：

    <div ng-repeat="type in types">
        <bettype-{{type.id}}></bettype-{{type.id}}>
    </div>

我需要的输出是：

<bettype-1></bettype-1>
<bettype-2></bettype-2>

我也在使用聚合物（通过这种方式，我可以创建自定义html标签）。

Answer 1

我认为最好的解决方案是创建一个创建自定义元素的指令，例如：

.directive('bettype', function($compile) {
    return {
        restrict: 'E',
        compile: function($element, $attr) {
            return function($scope, $element, $attr) {
                // Create new element here with $attr.number
                var number = $attr.number,
                    element = angular.element('<bettype-'+number+'></bettype-'+number+'>');
                // Replace newly created element
                $element.replaceWith(element);
                $compile($element)($scope);
            }
        }
    }
});

不知道这是否行得通，但可能就是这样。

注意：我认为用虚线分隔像bettype-1这样的元素不是一个好主意。