Javascript 信任TML内容不';t正确编码

Javascript 信任TML内容不';t正确编码,javascript,html,angularjs,Javascript,Html,Angularjs,只要开始学习 现在我有两个按钮用于电子邮件和推特共享。我使用标签和定义的css作为按钮样式。使用ng bind html,我想为电子邮件和tweet创建共享链接 现在,当鼠标悬停按钮时,浏览器底部显示的文本是正确的,但当我单击电子邮件按钮时,标题仍然正确,但正文内容混乱,显示: I%20score%20a%200%%20on%20on%20on%20this%20quick.%20Try%20to%20beat%20my%20score%20at%20%23 与tweet url相同 我想一定是

只要开始学习

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

现在,当鼠标悬停按钮时,浏览器底部显示的文本是正确的,但当我单击电子邮件按钮时,标题仍然正确,但正文内容混乱,显示: I%20score%20a%200%%20on%20on%20on%20this%20quick.%20Try%20to%20beat%20my%20score%20at%20%23

与tweet url相同

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

html:

使用下面的链接挑战您的朋友

js:

app.controller('QuizController',['$scope','$http','$sce',函数($scope,$http,$sce){
$scope.percentage=0;
$scope.createSharedLink=函数(百分比){
var url='abc.com';
var emailLink='';
var twitterLink='';
var newMarkup=emailLink+twitterLink;
返回$sce.trustAsHtml(newMarkup);//注入新的html
}
}

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


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

建议您使用指令和模板instead@charlietfl你能说得更具体一点吗?我对Angular不太熟悉。创建指令…是相当不言自明的。有很多关于指令的教程
<p>Use links below to challenge your friends.</p>
<div class="share" ng-bind-html="createSharedLinks(percentage)">
</div>
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
    }

}