trustAsHtml内容不会正确编码

现在我有两个电子邮件和tweet分享按钮。我使用标签并为按钮样式定义了css。用ng-bind-html，我想创建电子邮件和推文的共享链接。

现在，当鼠标悬停按钮，文本显示在浏览器的底部是正确的，但是当我点击电子邮件按钮，标题仍然是正确的，但主体内容是搞砸显示： I％20scored ％20a％200％20on％20is％20quiz。％20Try％20to％20beat％20my％20score％20at％20％23

与tweet url相同。

我想它一定是错误的编码。但为什么邮件标题是正确的？

HTML：

<p>Use links below to challenge your friends.</p> 
<div class="share" ng-bind-html="createSharedLinks(percentage)"> 
</div>

JS：

app.controller('QuizController', ['$scope','$http','$sce', function($scope, $http, $sce){ 
$scope.percentage = 0; 
    $scope.createSharedLinks = function(percentage){ 
     var url = 'abc.com'; 

     var emailLink = '<a class="btn email" href="mailto:?subject=Try to beat my quiz score!&amp;body=I scored a '+percentage+'% on this quiz. Try to beat my score at '+url+'">Email a Freind</a>'; 

     var twitterLink = '<a class="btn twitter" target="_blank" href="http://twitter.com/share?text=I scored a '+percentage+'% on this quiz. Try to beat my score at&amp;hashtags=SaturnQuiz">Tweet your score</a>'; 

     var newMarkup = emailLink + twitterLink; 

     return $sce.trustAsHtml(newMarkup); //inject new html 
    } 

}

来源

2015-10-17 luochenhuan

建议您使用指令和模板代替 – charlietfl

@charlietfl您能更具体吗？我是Angular的新手。 – luochenhuan

创建一个指令...是相当自我解释。关于指令有很多教程 – charlietfl

没有什么不对您的代码。事实上，trustAsHtml按预期工作。但是当你点击电子邮件链接时，url是对查询字符串进行编码的浏览器。

您可以使用开发人员工具查看实际内容。

来源

2015-10-17 16:34:46 Thangadurai

trustAsHtml内容不会正确编码

回答

相关问题