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

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

我已经创建了一个模型属性,但如果不打印HTML,就无法在视图中呈现它。


使现代化

问题似乎源于将创建的HTML作为引号中的字符串进行角度渲染。将尝试找到解决方法。

控制器示例:

var SomeController = function () {

    this.customHtml = '<ul><li>render me please</li></ul>';
}

示例视图:

<div ng:bind="customHtml"></div>

给予:

<div>
    "<ul><li>render me please</li></ul>"
</div>

当前回答

ng绑定html不安全不再有效。

这是最短的路:

创建筛选器:

myApp.filter('unsafe', function($sce) { return $sce.trustAsHtml; });

在您看来:

<div ng-bind-html="customHtml | unsafe"></div>

注:此方法不需要包含ngSanitize模块。

其他回答

ng绑定html不安全不再有效。

这是最短的路:

创建筛选器:

myApp.filter('unsafe', function($sce) { return $sce.trustAsHtml; });

在您看来:

<div ng-bind-html="customHtml | unsafe"></div>

注:此方法不需要包含ngSanitize模块。

我发现使用ng消毒液不允许我在html中添加ng点击。

为了解决这个问题,我添加了一个指令。这样地:

app.directive('htmldiv', function($compile, $parse) {
return {
  restrict: 'E',
  link: function(scope, element, attr) {
    scope.$watch(attr.content, function() {
      element.html($parse(attr.content)(scope));
      $compile(element.contents())(scope);
    }, true);
  }
}
});

这是HTML:

<htmldiv content="theContent"></htmldiv>

祝你好运

我今天试过了,唯一找到的办法就是

<div ng bind html unsafe=“expression”></div>

只是通过遵循angular(v1.4)文档使用ngBindHtml实现了这一点,

<div ng-bind-html="expression"></div> 
and expression can be "<ul><li>render me please</li></ul>"

确保在模块的依赖项中包含ngSanitize。那么它应该工作得很好。

也可以使用nginclude。

<div class="col-sm-9 TabContent_container" ng-include="template/custom.html">
</div>

您可以使用“ngshow”显示隐藏此模板数据。