javascript - 如何使用 Angular 函数导出 Angular HTML 模板

Question

我想创建一个 Angular 形状生成器。我有这样的模板:

<script type="text/ng-template" id="textarea.html">
    <div class="items form-group">
        <label class="col-sm-2 control-label">
            {{item.title}}
        </label>
        <div class="col-sm-10">
            <textarea ng-model="task.title" placeholder="{{item.placeholder}}" class="form-control"></textarea>
        </div>
    </div>
</script>

当用户添加此模板时，会生成如下所示的 Angular html 代码:

    <div class="items form-group">
        <label class="col-sm-2 control-label">
            {{item.title}}
        </label>
        <div class="col-sm-10">
            <textarea ng-model="task.title" placeholder="{{item.placeholder}}" class="form-control"></textarea>
        </div>
    </div>

在这个例子中，我的模板代码已渲染，但我不想渲染它，而只是显示 Angular html 代码。如果您有任何建议，请更改此代码。

<强> Example Code

Answer 1

您可以使用 ng-bind 代替 ng-include；

示例:

**in app.js.**

app.run(['$injector', function($injector) {
  var rootScope = $injector.get('$rootScope');

  rootScope.tpl = '<h1 style="color:green;">This is the page content</h1>';
}])

**in index.js**

<span ng-bind='tpl'></span>