可以在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>

推荐答案

对于Angular 1.x、 在HTML中使用ng-bind-html:

<div ng-bind-html="thisCanBeusedInsideNgBindHtml"></div>

At this point you would get a attempting to use an unsafe value in a safe context error so you need to either use 消毒 or $SCE to resolve that.

$SCE

在控制器中使用$SCE.trustAsHtml()来转换html字符串.

 $scope.thisCanBeusedInsideNgBindHtml = $SCE.trustAsHtml(someHtmlVar);

消毒

有2个步骤:

  1. 包括消毒剂.min.js资源,即:

    <script src="lib/angular/angular-sanitize.min.js"></script>
    
  2. 在js文件(controller或通常是app.js)中,包括消毒,即:

    angular.module('myApp', ['myApp.filters', 'myApp.services', 
        'myApp.directives', '消毒'])
    

Javascript相关问答推荐

我的glb文件没有加载到我的three.js文件中

没有输出到带有chrome.Devtools扩展的控制台

IMDB使用 puppeteer 加载更多按钮(nodejs)

Javascript,部分重排序数组

拖放仅通过 Select 上传

当作为表达式调用时,如何解析方法decorator 的签名?

我可以使用使用node.js创建的本地主机来存储我网站上提交的所有数据吗?没有SQL或任何数据库.只有HTML语言

在HTML语言中调用外部JavaScript文件中的函数

将内容大小设置为剩余可用空间,但如果需要,可在div上显示滚动条

在css中放置所需 colored颜色 以填充图像的透明区域

如何在Java脚本中对列表中的特定元素进行排序?

Next.js中的服务器端组件列表筛选

我想使用GAS和HTML将从Electron 表格中获得的信息插入到文本字段的初始值中

处理app.param()中的多个参数

Jexl to LowerCase()和Replace()

MongoDB通过数字或字符串过滤列表

如何在下一个js中更改每个标记APEXCHARTS图表的 colored颜色

Firebase函数中的FireStore WHERE子句无法执行

react :图表负片区域不同 colored颜色

带有JS模块模式的Rails的Importmap错误:";Net::ERR_ABORTED 404(未找到)&Quot;