用模板替换ng-include节点？

有点新的角度.是否可以用包含的模板的内容替换 ng-include节点？例如,用:

生成的html是:

    
    

         
        
Test
         
    

但我想要的是:

    
    
Test

Brady Isom.. 134

我有同样的问题,仍然希望ng-include的功能包括动态模板.我正在构建一个动态的Bootstrap工具栏,我需要清洁标记才能正确应用CSS样式.

以下是我为那些感兴趣的人提出的解决方案:

HTML:

自定义指令:

app.directive('includeReplace', function () {
    return {
        require: 'ngInclude',
        restrict: 'A', /* optional */
        link: function (scope, el, attrs) {
            el.replaceWith(el.children());
        }
    };
});

如果在上面的示例中使用了此解决方案,则将scope.dynamicTemplatePath设置为"test.html"将导致所需的标记.

1> Brady Isom..：

---

我有同样的问题,仍然希望ng-include的功能包括动态模板.我正在构建一个动态的Bootstrap工具栏,我需要清洁标记才能正确应用CSS样式.

以下是我为那些感兴趣的人提出的解决方案:

HTML:

自定义指令:

app.directive('includeReplace', function () {
    return {
        require: 'ngInclude',
        restrict: 'A', /* optional */
        link: function (scope, el, attrs) {
            el.replaceWith(el.children());
        }
    };
});

如果在上面的示例中使用了此解决方案,则将scope.dynamicTemplatePath设置为"test.html"将导致所需的标记.

---

请注意,这样的DOM操作非常hacky.如果包含的模板的根元素使用类似ng-repeat的东西,则会出现问题.它无法在DOM中插入结果.

2> SunnySydeUp..：

---

所以感谢@ user1737909,我意识到ng-include不是那样的.指令是更好的方法,更明确.

var App = angular.module('app', []);

App.directive('blah', function() {
    return {
        replace: true,
        restrict: 'E',  
        templateUrl: "test.html"
    };
});

在html中:

---

谢谢!正在寻找一个ng-include解决方案,但这有助于我实现指令更好

3> xeor..：

---

我有同样的问题,我的第三方CSS样式表不喜欢额外的DOM元素.

我的解决方案非常简单.只需将ng-include 1向上移动即可.而不是

我只是做了:

我敢打赌,这在大多数情况下都有效,即使技术上不是问题所在.

4> 小智..：

---

另一种方法是编写自己的简单替换/包含指令,例如

    .directive('myReplace', function () {
               return {
                   replace: true,
                   restrict: 'A',
                   templateUrl: function (iElement, iAttrs) {
                       if (!iAttrs.myReplace) throw new Error("my-replace: template url must be provided");
                       return iAttrs.myReplace;
                   }
               };
           });

然后将使用如下:

5> Sai Dubbaka..：

---

这是替换孩子的正确方法

angular.module('common').directive('includeReplace', function () {
    return {
        require: 'ngInclude',
        restrict: 'A',
        compile: function (tElement, tAttrs) {
            tElement.replaceWith(tElement.children());
            return {
                post : angular.noop
            };
        }
    };
});

---

我包含的部分html得到了一些ng-repeat,这是解决它们的唯一答案!非常感谢.