Question

我试图简单地将单个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;
    });
});

这是twig（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>

任何帮助都会很棒;因为能够使用Angular通过JSON打印东西将成为这个构建的关键任务。

Answer 1

归功于@JAAulde和@Claies：

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

将Json打印为带有Angular的HTML字符串

1 个答案: