0

我试图简单地将单个 JSON 对象打印为 HTML 字符串。我在树枝模板中执行此操作;所以我已将 Angulars 默认输出更改为 {[{}]}。当我在 ng-inspector 中查看应用程序时,我看到了所有 JSON,但我无法将其打印为 HTML。

我试过测试一个简单的角度字符串输出,这似乎工作正常。

JSON 文件(与脚本分开的文件):

{
    header: {
        title: "Insights",
        slug: "insights",
        content: {
            items: "@self.children"
        }
    },
    content: "",
    children: [
        {
            header: {
                title: "item test",
                taxonomy: {
                    category: [
                        "blog"
                    ],
                    tag: [
                        "test"
                    ]
                }
            },
            content: "This is a test"
        }
    ]
}

这是应用程序:

var blogJson = "http://localhost:8888/sean/insights?return-as=json";//cache json url
var blogCat = angular.module('blogCategories', []).config(function($interpolateProvider){
    $interpolateProvider.startSymbol('{[{').endSymbol('}]}');
});//cache app

//master controller
blogCat.controller('blogFilters', function($scope, $http) {
    $http.get(blogJson).success(function(data) {
        $scope.blogHeader = data;
    });
});

这是树枝(html,仅发布相关内容,但是是的,应用程序和控制器块已关闭):

<div class="blog_app_wrap" ng-app="blogCategories" ng-controller="blogFilters">
    <section class="blog_header">
        <div class="header_text_wrap">
            <div class="blog_title">
                <h1>Latest Mortgage Insight</h1>
                <div class="underline_center"></div>
            </div>
            <div class="header_text">
                <h2>{[{children[0].header.title}]}</h2>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
                <a class="small_button" href="javascript:void(0)">Read Full Article</a>
            </div>
        </div>

任何帮助都会很棒;因为能够通过 JSON 使用 Angular 打印内容对于此构建至关重要。

4

1 回答 1

1

归功于@JAAulde 和@Claies:

您将数据分配给 $scope 的 blogHeader 属性。因此,在您的模板中,每次您想从数据中访问一个值时,您都需要从 blogHeader 开始。例如,在您的 h2 中,您需要使用 blogHeader.children[0].header.title

于 2016-07-21T13:42:28.107 回答