Question

我有一个mysql数据库，用于存储我想在页面上显示的文本值（文章正文）。我想存储然后显示一些文本格式，但不知道如何用角度来做。

我使用php PDO echo json_encode输出我的数据库查询结果。

所以我想我只是在我的文本中插入一些html标记（一些标题和段落标记），然后让浏览器对其进行格式化，但现在我的浏览器将html标记显示为文本。

是否有AngularJS过滤器可以轻松完成此操作？我通过文档搜索但无法找到类似的东西。

我真的不想为我存储在数据库中的每一篇文章编写html标记，但我不知道如何做到这一点。在此之前，我刚刚编写了一个自定义jQuery函数，用<br>等替换了行制动器。

这是我的代码：

HTML：

<div id="full-article" ng-repeat="fArticle in fullArticle" ng-show="!feed" ng-hide="feed">
    <h1>{{ fArticle.title }}</h1>
    <h3>{{ fArticle.posted | date:"dd.MM.yyyy"}}</h3>
    <p>{{ fArticle.body }}</p>
    <button ng-click="backToFeed()">Back to articles</button>
</div>

控制器：

'use strict';

angular.module('ptcAngularJsApp')
    .controller('ArticlesCtrl', function ($scope, $http) {
        //

        $scope.fullArticle = [];
        $scope.feed = true;
        $scope.message = '';


        $scope.findArticleByTitle = function(article) {
            $http.post('http://localhost/PTC_db_PHP/article_by_title.php', article.title).
                success(function(response) {
                    $scope.fullArticle = response;
                    $scope.feed = false;
                }). //end http post response
                error(function(err) {
                    console.log(err);
                }); //end http post error
        }; //end findArticleByTitle 

        }); //end .controller

我删除了与此问题无关的代码部分。如果您需要更多

Answer 1

Angular不允许你立即显示html，你必须说它是值得信任的，所以改变你的成功（确保你有依赖注入$ sce）：

$scope.fullArticle = response;
for(var x = 0; x < $scope.fullArtcile.length; x++){
    $scope.fullArticle[x].trustedBody = $sce.trustAsHtml($scope.fullArticle[x].body)
}

然后制作你的HTML：

<p data-ng-bind-html="fArticle.trustedBody"></p>

您可以在此处阅读：https://docs.angularjs.org/api/ng/directive/ngBindHtml并查看以下答案：With ng-bind-html-unsafe removed, how do I inject HTML?

Answer 2

你需要的是ngBindHtml。请在此处查看：https://docs.angularjs.org/api/ng/directive/ngBindHtml

使用AngularJS进行文本格式化

2 个答案: