Question

刚开始学习Angular JS。

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

现在当鼠标悬停在按钮上时，浏览器底部显示的文字是正确的，但是当我点击电子邮件按钮时，标题仍然正确，但是正文内容混乱了，显示：的 I％20scored％20A％200 %% 20on％20this％20quiz。％20Try％20to％20beat％20my％20score％20AT％20％23

与推文网址相同。

我想编码一定有问题。但为什么电子邮件标题是对的？

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
    }

}

Answer 1

您的代码没有任何问题。事实上，trustAsHtml按预期工作。但是当您单击电子邮件链接时，url会对查询字符串进行编码。

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

trustAsHtml内容编码不正确

1 个答案: