javascript - 如何使用一个不明确的指令呈现不同的指令

Question

我接管了别人的代码，我对他们试图实现的目标感到好奇。本质上它看起来像这样:

在 HTML 中

<my-directive ng-repeat="directive in directives" dtype="directiveType"></my-directive>

然后他有一个如下所示的服务

appName.factory('directiveTemplates', function () {
var templateMap = {
    directiveOne: '<directive-one/>',
    directiveTwo: '<directive-two/>',
    directiveThree: '<directive-three/>',
    directiveFour: '<directive-four/>'
};

return {
    getTemplate: function (type) {
        return templateMap[type];
    }
};
});

在 myDirective.js 中他的模板函数是这样的

template: function (element, attr) {
    return sfTemplate.getTemplate(attr.dtype);
}

这似乎有两个问题，第一个是 dtype 属性在获取值之前不会呈现，即使它确实呈现，模板本身也不会呈现并以明文形式显示在页面上。

他想要做的事情可能吗？

Answer 1

我只会使用一个如下所示的模板:

<div ng-switch="dtype">
  <directive-one ng-switch-when="directiveOne"/>
  <directive-two ng-switch-when="directiveTwo"/>
  ...
</div>

将 dtype: '@' 添加到 myDirective 的 scope 中，Bob 是你的叔叔。

编辑:错过了ng-repeat。我会完全删除 myDirective ，因为整个事情相当于:

<directive-one/>
<directive-two/>
...