Javascript Popover未将字符串绑定为html angularjs
我有以下代码Javascript Popover未将字符串绑定为html angularjs,javascript,angularjs,twitter-bootstrap,Javascript,Angularjs,Twitter Bootstrap,我有以下代码 <html ng-app="ui.bootstrap.demo"> <head> <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.js"></script> <script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.12.1.js"><
<html ng-app="ui.bootstrap.demo">
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.js"></script>
<script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.12.1.js"></script>
<script src="example.js"></script>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div ng-controller="PopoverDemoCtrl">
Hello, All
<img class="tip" data-placement="bottom" src="http://static.loanstreet.com.my/assets/common/glasses.png" popover="{{my_html}}" popover-trigger="mouseenter">
</div>
</body>
</html>
我想在底部显示popover模板以及“,您需要覆盖popover的默认html模板,并使用$sce服务将html与其绑定 对不安全数据使用$sce:-
angular.module('ui.bootstrap.demo').filter('unsafe', ['$sce', function ($sce) {
return function (val) {
return $sce.trustAsHtml(val);
};
}]);
覆盖默认popover的模板:-
angular.module("template/popover/popover.html", []).run(["$templateCache", function ($templateCache) {
$templateCache.put("template/popover/popover.html",
"<div class=\"popover {{placement}}\" ng-class=\"{ in: isOpen(), fade: animation() }\">\n" +
" <div class=\"arrow\"></div>\n" +
"\n" +
" <div class=\"popover-inner\">\n" +
" <h3 class=\"popover-title\" ng-bind-html=\"title | unsafe\" ng-show=\"title\"></h3>\n" +
" <div class=\"popover-content\"ng-bind-html=\"content | unsafe\"></div>\n" +
" </div>\n" +
"</div>\n" +
"");
}]);
angular.module(“template/popover/popover.html”,[])。运行([“$templateCache”,函数($templateCache){
$templateCache.put(“模板/popover/popover.html”,
“\n”+
“\n”+
“\n”+
“\n”+
“\n”+
“\n”+
“\n”+
“\n”+
"");
}]);
可能存在的副本
angular.module("template/popover/popover.html", []).run(["$templateCache", function ($templateCache) {
$templateCache.put("template/popover/popover.html",
"<div class=\"popover {{placement}}\" ng-class=\"{ in: isOpen(), fade: animation() }\">\n" +
" <div class=\"arrow\"></div>\n" +
"\n" +
" <div class=\"popover-inner\">\n" +
" <h3 class=\"popover-title\" ng-bind-html=\"title | unsafe\" ng-show=\"title\"></h3>\n" +
" <div class=\"popover-content\"ng-bind-html=\"content | unsafe\"></div>\n" +
" </div>\n" +
"</div>\n" +
"");
}]);