如何添加静态HTML生成的模板里面AngularJS？

问题描述

有没有办法来添加生成的模板里面静态HTML？

我有code：

 ＆LT;试验＆gt;＆LT; /试验＆gt;
＆LT;试验＆gt;＆LT; /试验＆gt;＆LT;脚本＆GT;
VAR应用= angular.module（对myApp，[]）;
app.directive（测试，函数（）{
    返回{
        模板：
        '＆LT; D​​IV CLASS =包装＆GT;' +
        '＆LT; D​​IV CLASS =内容＆GT;' +
        '＆LT; / DIV＆GT;' +
        '＆LT; / DIV＆GT;'
    };
}）;
＆LT; / SCRIPT＆GT;
 

...然后，我想补充＆LT; P＆GT;富＆LT; / P＆gt;首先在（见下面黄色注）LT ;内容＆GT; ，但里面没有第二个。因此，输出应该是：

 ＆LT;试验＆gt;
    ＆LT; D​​IV CLASS =包装＆GT;
        ＆LT; D​​IV CLASS =内容＆GT;
            富
        ＆LT; / DIV＆GT;
    ＆LT; / DIV＆GT;
＆LT; /试验＆gt;＆LT;试验＆gt;
    ＆LT; D​​IV CLASS =包装＆GT;
        ＆LT; D​​IV CLASS =内容＆GT;
        ＆LT; / DIV＆GT;
    ＆LT; / DIV＆GT;
＆LT; /试验＆gt;
 

我该怎么办呢？

作为aksed中的注释。

解决方案

You can use ngTransclude here.

You would define your directive like this:

var app = angular.module("myApp", []);
app.directive("test", function() {
    return {
        transclude: true,
        template:
        `<div class="wrapper">
            <div class="content">
                <ng-transclude></ng-transclude>
            </div>
        </div>`
    };
});

Then in your HTML, you would have:

<test>
    <p>foo</p>
</test>
<test></test>

And the <p>foo</p> will be inserted automatically inside the ng-transclude element in your template.

More information on AngularJS documentation.

这篇关于如何添加静态HTML生成的模板里面AngularJS？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！