与定制指令结合使用

HTML：

<div ng-app="myApp">
  <x-template-field x-ng-repeat="field in ['title','body']" />
</div>

JS：

angular.module('myApp',[])
    .directive('templateField',function () {
        return {
            restrict: 'E',compile: function(element,attrs,transcludeFn) {
                element.replaceWith('<input type="text" />');
            }
        };
    });

看到这个JS小提琴：http://jsfiddle.net/GDfxd/

这里的问题是没有任何替代。我想要完成的是2x输入字段的输出，“x-template-field”标签在DOM中完全替换。我的怀疑是，由于ng-repeat在同一时间修改DOM，所以这不会奏效。

根据this堆栈溢出问题，接受的答案似乎表明这实际上在早期版本的AngularJS(？)中有效。

element.html(‘…’)不会工作吗？

虽然element.html(‘…’)实际上将生成的HTML注入到目标元素中，但我不希望HTML作为模板标签的子元素，而是在DOM中完全替换它。

为什么不用包含ng-repeat指令的另一个标签包装我的模板标签？

基于与上述相同的原因，我不希望生成的HTML作为重复标签的子元素。虽然它可能在我的应用程序中正式工作，但我仍然觉得我已经调整了我的标记，以适应Angular，而不是相反。

为什么我不使用“模板”属性？

我没有找到任何方法来更改从“template”/“templateUrl”属性中检索的HTML。我想注入的HTML不是静态的，它是从外部数据动态生成的。

我也很挑剔我的标记吗？

大概。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!