相关疑难解决方法(0)

将HTML插入视图

是否可以在AngularJS控制器中创建HTML片段并在视图中显示此HTML?

这需要将不一致的JSON blob转换为嵌套的id : value对列表.因此,HTML是在控制器中创建的,我现在希望显示它.

我创建了一个模型属性,但是如果不打印HTML,则无法在视图中呈现它.


更新

似乎问题来自角度渲染创建的HTML作为引号内的字符串.将试图找到解决这个问题的方法.

示例控制器:

var SomeController = function () {

    this.customHtml = '<ul><li>render me please</li></ul>';
}
Run Code Online (Sandbox Code Playgroud)

示例视图:

<div ng:bind="customHtml"></div>
Run Code Online (Sandbox Code Playgroud)

给:

<div>
    "<ul><li>render me please</li></ul>"
</div>
Run Code Online (Sandbox Code Playgroud)

javascript escaping html-sanitizing angularjs

788
推荐指数
9
解决办法
64万
查看次数

角$编译为字符串以生成代码

我正在使用Angular构建通用代码生成器

我有动态数据结构和模板,旨在构建不同类型的代码。HTML,C#,SQL,Javascript,CSS,Ruby。

在此处输入图片说明

我已经获得$ compile函数作为指令的一部分工作,并且可以在Angular页面中注入元素。

我真正需要的是生成一个简单的字符串的生成。

我读过的每一篇文章都谈到获取编译后的输出并将其注入角度管道,这不是我的要求。

有谁知道我可以从已经与合并范围数据合并的已编译模板中提取一个简单的字符串吗?

angular.module('workibleServerApp')
  .directive('generateDynamicTemplate', ['$compile', function ($compile) {
      return {
          scope: true,
          data: '=',
          rawTemplate: '=',
          restrict: 'E',
          link: function (scope, element, attrs) {

              scope.$watchGroup([attrs.data, attrs.rawTemplate], function (newValues) {

                  scope.data = newValues[0];
                  var rawTemplate = newValues[1];

                  element.html('');
                  //element.html('<textarea id="outputRaw" name="outputRaw" class="form-control" rows="12">');

                  if (!_.isEmpty(scope.data) && !_.isEmpty(rawTemplate)) {
                      var tl = angular.element(rawTemplate);
                      var compiled = $compile(tl)(scope);
                      element.append(compiled);

                      scope.convertToString = compiled;
                  }
                  //element.append('</textarea>');
              });


          }
      };
  }]);
Run Code Online (Sandbox Code Playgroud)

没有填充convertToString

              <div class="col-md-6">
                    <h6><strong>Output</strong></h6>
                    <!-- This renders output from the …
Run Code Online (Sandbox Code Playgroud)

code-generation angularjs

5
推荐指数
0
解决办法
540
查看次数