如何从服务器获取带有 HTML 标签的文本并在客户端使用 HTML 标记显示它?(使用 php 和 angularjs)

安杰乔

我正在尝试通过创建应用程序来学习 Web 开发。我在客户端使用 Angularjs,在服务器端使用 php。当用户选择一篇文章时,我需要从服务器加载文章的内容。我想在服务器端做 html 标记,然后在客户端获取文本并显示它。(即我想将文本保存为“< h1>标题</h1> < p>段落</p>”,然后将文本传输到客户端并在客户端中显示。

我尝试在带有标记标签的 php 文件中回显文本,然后通过 angularjs 中的 $http 服务获取文本。但是浏览器似乎没有识别标记标签,而是显示带有文本的 html 标签。

我怎样才能做到这一点?

笔记2.php

 <?php
    $variable = <<<XYZ
                <html>
                <body>
                    <h1>Heading</h1>
                    <p> paragraph </p>
                </body>
                </html>
XYZ;

    echo $variable;
 ?>

getnotes.html

<!DOCTYPE html>
<html>
<script src="js/angular.min.js"></script>
<script src="js/angular-route.js"></script>

<body ng-app="myApp" ng-controller="myCtrl">
<p id="demo"></p>

<script>
var app = angular.module("myApp", ["ngRoute"]);

app.controller('myCtrl', ['$scope', '$http', function($scope, $http){

$http.get("http://localhost:8080/json_test/notes2.php").then(function(response) {
            $scope.myText = response.data;
        });
}]);
</script>

<script>
document.getElementById("demo").innerHTML = "{{myText}}";
</script>

</body>
</html>
穆罕默德·内斯温

ng-bind-html如果在 angular 应用程序中没有任何角度绑定,则可以使用将字符串绑定为 HTML。像这样:

// in controller
$scope.html = "< h1>Heading< /h1> < p>paragraph< /p>";

// in HTML
<div ng-bind-html="html"></div>

如果您有任何角度绑定,您可以使用$compile服务来绑定它。$compile创建具有角度绑定到作用域的 DOM 元素。这就是您通常用来呈现 DOM 以进行双向绑定等工作的内容。在大多数情况下,您不会手动调用它,因为如果您将template添加templateUrl到指令定义对象,它将$compile自动运行

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章