Json을 각도가있는 HTML 문자열로 인쇄하십시오.

단일 JSON 객체를 HTML 문자열로 간단하게 인쇄하려고합니다. 나는 나뭇 가지 틀에서 이것을하고있다. 그래서 Angulars의 기본 출력을 {[{}]}로 변경했습니다. ng-inspector에서 응용 프로그램을 볼 때 JSON이 모두 표시되지만 HTML로 인쇄 할 수는 없습니다.Json을 각도가있는 HTML 문자열로 인쇄하십시오.

간단한 각도 문자열 출력을 테스트 해봤는데 정상적으로 작동하는 것 같습니다. 예 응용 프로그램

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은,하지만 :

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" 
     } 
    ] 
}

는 응용 프로그램입니다 컨트롤러 블록이 닫혀 있음) :

<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를 사용하여 사물을 인쇄 할 수 있다는 것은이 빌드에서 중요한 역할을 할 것입니다.

출처

2016-07-21 JoethaCoder

JSON.stringify ()는 json 객체의 완전한 표현을 제공합니다. 그게 당신이보고있는 것입니까? – ArunGeorge

'$ scope'의'blogHeader' 속성에 데이터를 할당했습니다. 따라서 템플릿에서, 데이터 내에서 값에 접근 할 때마다'blogHeader'에서 시작해야합니다. 예를 들어,'h2'에서'blogHeader.children [0] .header.title'을 사용해야합니다. – JAAulde

'$ scope'에'children' 객체가 없으면'blogHeader' 객체가 있습니다. try {{{blogHeader.children [0] .header.title}]}'; 또는'children' 배열에 항목이 여러 개있는 경우'ng-repeat'을 사용해보십시오. – Claies

신용 @JAAulde 및 @Claies로 이동 :

당신은 $ 범위의 blogHeader 속성에 데이터를 할당. 따라서 템플릿에서 데이터 내에서 값에 액세스 할 때마다 blogHeader에서 시작해야합니다. 예를 들어 h2에서 blogHeader.children [0] .header.title을 사용해야합니다.

출처

2016-07-21 13:42:28 JoethaCoder

Json을 각도가있는 HTML 문자열로 인쇄하십시오.

답변

관련 문제