Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/374.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 在$sce.trustAsHtml内填充双花括号_Javascript_Html_Angularjs_Angularjs Directive_Angularjs Interpolate - Fatal编程技术网

Javascript 在$sce.trustAsHtml内填充双花括号

Javascript 在$sce.trustAsHtml内填充双花括号,javascript,html,angularjs,angularjs-directive,angularjs-interpolate,Javascript,Html,Angularjs,Angularjs Directive,Angularjs Interpolate,我必须呈现一个字符串(item.tabs.review.content),该字符串使用$sce.trustAsHtml解析为HTML 我遇到的主要问题是字符串中引用了item对象(item.tabs.review.images)中的数组 我遇到的问题是,一旦HTML在浏览器中呈现,双大括号就会被忽略,并且不会被对象填充 <h1>TEsting</h1> <img ng-src='data{{item.tabs.review.images[0].filetype}};

我必须呈现一个字符串(item.tabs.review.content),该字符串使用$sce.trustAsHtml解析为HTML

我遇到的主要问题是字符串中引用了item对象(item.tabs.review.images)中的数组

我遇到的问题是,一旦HTML在浏览器中呈现,双大括号就会被忽略,并且不会被对象填充

<h1>TEsting</h1>
<img ng-src='data{{item.tabs.review.images[0].filetype}};base64{{item.tabs.review.images[0].base64}}'>
测试

又加了一个扑通

我建议首先使用
$parse
创建一个使用值的指令,
$parse
范围将给出指令属性中提供的范围变量的值。然后取消对
html
的scape,将html
实体
替换为html标记,因此您应该使用
unescapethtml
函数,我添加了一个答案。之后,使用
$interpolate
获取
{{}}
插值内容的值将给出您的
src
$sce.parseHtml
以清理html内容

标记

.material(bind-img='item.tabs.review.content')
指令

angular.module('app').directive('bindImg', function($parse, $interpolate, $sce) {
  return {
    link: function(scope, element, attrs) {
      var parsed = $parse(attrs.bindImg)(scope)
      parsed = unescapeHTML(parsed)
      var html = $interpolate(parsed)(scope)
      element.html($sce.trustAsHtml(html));
    }
  }
})

//unescape html
function unescapeHTML(escapedHTML) {
  return escapedHTML.replace(/&lbrace;/g,'{').replace(/&rbrace;/g,'}');
}

您的意思是“var html=$interpolate(input)($scope)”吗?我试过你的代码,所有的东西都被过滤掉了。使用上面的代码可以呈现HTML,但是没有从$scope填充{{item.tabs.review.images[0].filetype}。到目前为止,我认为ng bind使用innerHtml进行填充,甚至没有看到{{}}。。。谢谢你的关注up@JohnSpiteri哦..您正在渲染来自
ng repeat
的图像?我正在保存图像base64,当数据库对象返回时,它将所有材质都保存在一个对象中。使用我正在做的事情-用户正在将有效的HTML输入textarea元素,该元素将保存为字符串(item.tabs.review.content)。在该字符串中,我引用的图像是该对象的一部分(item.tabs.review.images)。使用ng bind html='item.tabs.review.content,我只得到未填充的空{{}?我尝试了您的代码,但仍然没有得到任何返回。我要很快地做一个扑通一声。。。谢谢你你的plunker工作得很好。。。谢谢你@Pankaj Parkar,回答得好。
angular.module('app').directive('bindImg', function($parse, $interpolate, $sce) {
  return {
    link: function(scope, element, attrs) {
      var parsed = $parse(attrs.bindImg)(scope)
      parsed = unescapeHTML(parsed)
      var html = $interpolate(parsed)(scope)
      element.html($sce.trustAsHtml(html));
    }
  }
})

//unescape html
function unescapeHTML(escapedHTML) {
  return escapedHTML.replace(/&lbrace;/g,'{').replace(/&rbrace;/g,'}');
}