Angular-strap: html元素呈现为文本，为什么？
Angular-strap: html元素呈现为文本，为什么？
提问于 2015-08-12 18:27:03
我刚刚安装了angular-strap，我正在尝试其中的一些功能。我有一个模态函数，但是内容不会呈现<br />元素，它会将其呈现为文本。我不明白为什么，文档显示它工作正常。据我所知，我做的每件事都是正确的。
有人能发现我的代码有什么问题吗？我已经尽可能地把它剥离了。我之前确实包含了ngAnimate和ngSanitize。
var app = angular.module('app', ['mgcrea.ngStrap'])
.controller('myCtrl', function($scope) {
$scope.modal = {
"title": "Title",
"content": "Hello Modal <br/> This is a multiline message!"
};
});
<html ng-app="app">
<head>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-strap/dist/angular-strap.min.js"></script>
<script src="bower_components/angular-strap/dist/angular-strap.tpl.min.js"></script>
<script src="//cdn.jsdelivr.net/angularjs/1.4.2/angular-animate.min.js" data-semver="1.4.2"></script>
<script src="//cdn.jsdelivr.net/angularjs/1.4.2/angular-sanitize.min.js" data-semver="1.4.2"></script>
<script src="app.js"></script>
</head>
<body>
Angular Strap
<div ng-controller="myCtrl">
<!-- Button to trigger a default modal with a scope as an object {title:'', content:'', etc.} -->
<button type="button" class="btn btn-lg btn-primary" data-animation="am-fade-and-scale" data-placement="center" bs-modal="modal">Click to toggle modal
<br>
<small>(using an object)</small>
</button>
</div>
</body>
</html>回答 2
Stack Overflow用户
发布于 2015-08-12 18:50:46
您的问题可能与Angular在显示通过编程获得的任何变量时不解释HTML代码的事实有关。
你应该看看这个指令：https://docs.angularjs.org/api/ng/directive/ngBindHtml，它可能会解决你的问题！
Stack Overflow用户
发布于 2015-08-12 19:05:06
我已经把它弄好了。
根据文档：replace ng-bind with ng-bind-html, requires ngSanitize to be loaded
我根据文档中的plunkr设置了一个选项，我的代码现在看起来像这样：
var app = angular.module('app', ['ngAnimate','ngSanitize', 'mgcrea.ngStrap'])
.config(function($modalProvider) {
angular.extend($modalProvider.defaults, {
html: true
});
})
.controller('myCtrl', function($scope) {
$scope.modal = {
"title": "Title",
"content": "Hello Modal <br/> This is a multiline message!"
};
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/31962560
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号