我使用Angular JS作为一个简单的网络应用程序。
我有一个包含多个段落的JSON对象。因此,我需要将段落分成两行。我做了一些研究,我找到了类似问题的一些答案,但因为它们没有放在上下文中,所以我不理解它们。我试着看看JSON是否有内置的东西迫使换行,因为那样做,但我没有找到。
非常感谢帮助!
HTML w / Angular JS
<div class="bio">
{{exhibits[whichItem].bio}}
</div>
JSON
[
{
"name":"Name goes here",
"bio":"First long block of text goes here then it needs a break <br /> and the second long block of text is here."
}
]
AngularJS - controllers.js
var exhibitListControllers = angular.module('exhibitListControllers', ['ngAnimate']);
exhibitListControllers.controller('ListController', ['$scope', '$http', function($scope, $http){
$http.get('js/data.json').success(function(data) {
$scope.exhibits = data;
$scope.exhibitOrder = 'name';
});
}]);
答案 0 :(得分:1)
来自https://docs.angularjs.org/api/ng/directive/ngBindHtml
和
https://docs.angularjs.org/api/ngSanitize
ng-bind-html评估表达式并以安全的方式将生成的HTML插入到元素中。默认情况下,生成的HTML内容将使用$ sanitize服务进行清理。要使用此功能,请确保$ sanitize可用,例如,在模块的依赖项中包含ngSanitize(不在核心AngularJS中)。要在模块的依赖项中使用ngSanitize,您需要在应用程序中包含“angular-sanitize.js”。
在html页面中,您可以执行此操作
<div ng-controller="ExampleController">
<p ng-bind-html="myHTML"></p>
</div>
并在您的控制器中:
angular.module('bindHtmlExample', ['ngSanitize'])
.controller('ExampleController', ['$scope', function($scope) {
$scope.myHTML =
'I am an <code>HTML</code>string with ' +
'<a href="#">links!</a> and other <em>stuff</em>';
}]);
或
您也可以尝试这样的事情:
app.filter('to_trusted', ['$sce', function($sce) { return function(text) { return $sce.trustAsHtml(text); }; }]);
然后,在视图中:
ng-bind-html=" myHTML | to_trusted"