我的数据是json_endoded($data);
数组,由我的工厂服务获取。然后将其放入Javascript变量中,该变量又用作模板。当最终显示到页面时,输出如下所示:
Some text here<br/><br/> And some link <a class="someclass" href="#">here</a>.
你懂的。如果我print_r或者甚至看到json_endoded数组(直接在Angularjs服务调用数据的PHP页面上),这样的HTML标签是不可见的,break被正确解释-在那里有一个新的行,等等…
我可以用什么来解决这个问题-我不想只是剥离所有的标签-我需要保留任何链接或类似的东西(这些是来自各种社交网络的帖子)。
在MY DIRECTIVE中,变量中的字符串就是这样被用作模板的:
angular.module('socialPosts.directives', [])
.directive('timelinePost', function($compile){
var timelineV2 = "<time class='cbp_tmtime'>'n'
<span>{{content.publishedDate}}</span>'n'
<span>{{content.publishedMonth}}</span>'n'
</time><i class='cbp_tmicon rounded-x hidden-xs'></i>'n'
<div class='cbp_tmlabel'>'n'
<h2>{{content.displayName}}</h2>'n'
<div class='row'>'n'
<div class='col-md-4'>'n'
<a href='' target='_blank'><img class='img-responsive' src='{{content.imageSrc}}' alt='' /></a>'n'
<div class='md-margin-bottom-20'></div>'n'
</div>'n'
<div class='col-md-8'>'n'
<p>{{content.content}}</p>'n'
</div>'n'
</div>'n'
</div>";
var getTemplate = function(type){
var template = '';
switch(type){
case 'googleplus':
template = timelineV2;
break;
case 'facebook':
template = timelineV2;
}
return template;
};
var linker = function(scope, element, attrs){
scope.$watch('networkCalled', function(value){
if(value){
element.html(getTemplate(value));
$compile(element.contents())(scope);
}
});
};
return {
restrict: "A",
replace: true,
link: linker,
scope: {
content: '=',
networkCalled: '='
}
}
})
如果你在做这样的事情
<div>{{myVariable}}</div>
然后改成这样
<div ng-bind-html="myVariable"></div>
这可能会导致错误,可以使用ngSanitize
或$sce
解决,如文档