javascript - 如何从 JSON 字符串中使用 AngularJS 显示 HTML

标签 javascript angularjs jsonp

我正在努力显示来自 JSON 字符串的 HTML 代码。您可以在地址中看到 HTML 标记。有什么办法可以正确显示它吗?

我的模板是:

<div ng-app ng-controller="jsonp_example">
    <ul ng-repeat="item in data">
        <li>{{item.ID}}</li>
        <li>{{item.post_title}}</li>
        <li ng-bind-html-unsafe="getContent(obj)">{{item.custom_fields.sponsor_address}}</li>
        <li>
            <img src="{{item.custom_fields.sponsor_logo}}" width="100">
            <ul>
                <li>
                   <hr>
                </li>
            </ul>
        </li>
    </ul>
</div>

和脚本:

function jsonp_example($scope, $http) {
    $scope.getContent = function (obj) {
        return obj.custom_fields.sponsor_address
    };

    var url = "https://eventident.com/api/getposts/?auth_key=s2mEus39R296M5F6n343A3dh9c62f7cm&custom_post=sponsors&callback=JSON_CALLBACK";

    $http.jsonp(url).success(function (data) {
        $scope.data = data.result;
    });
}

请随时修改我的jsfiddle:http://jsfiddle.net/1295z4bc/

最佳答案

您是否将 angular-sanitize.js 作为依赖项包括在内? (作为脚本和 Angular 模块依赖)

此外,您不需要使用 ng-bind-html {{}},只需

<li ng-bind-html="item.custom_fields.sponsor_address"></li>

会做。

关于javascript - 如何从 JSON 字符串中使用 AngularJS 显示 HTML,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33669220/

相关文章:

jquery - 跨域 jQuery Ajax 请求和 WCF REST 服务

jquery - 将 jQuery Post 发送到 Google API 时出现访问控制允许来源错误

javascript - 我正在努力验证联系表格。我是否做了太多过滤?

javascript - Mixitup - 未捕获的类型错误 : Cannot read property 'left' of undefined

javascript - 在单独的选项卡中初始化同位素的多个实例。标签破坏同位素

angularjs - 为什么我的 angularjs 网站不能完全抓取?

javascript - 当 Selenium 中自动下拉菜单时,无法触发 Angular ng-change 功能

javascript - 为什么我的 Angularjs 服务不允许我调用它?

javascript - Promise.all 返回未定义

javascript - Android 视频元素上的 Chrome 无法从 mediaRecorder blob 数据 url 播放