루프의 자료 Wordpress 기사에서 폴리머

Question

나는 몇 가지 wordpress 기사를 표시하는 폴리머 요소를 작성하고 싶습니다. http://www.jsv-lippstadt.de/?json=get_category_posts&slug=app < - 모든 게시물이 포함 된 Json 파일입니다.

내 코드 :

<link rel="import" href="../bower_components/polymer/polymer.html"> 
<script src="http://code.jquery.com/jquery-latest.js"></script> 

<polymer-element name="wordpress-post" attributes="from"> 
<template> 
    <h1>Test</h1> 
</template> 

<script> 
    Polymer('wordpress-post', { 
     ready: function() { 
      alert(this.from); 
      $.ajax({ 
       type: "GET", 
       url: "http://www.jsv-lippstadt.de/?json=get_category_posts&slug=" + this.from, 
       dataType: 'jsonp', 
       error: function() { 
        alert('Unable to load feed, Incorrect path or invalid feed'); 
       }, 
       success: function (data) { 
        console.log(data); 
        var arr = $.map(data, function(el) { return el; }) 
        console.log(arr); 
       } 
      }); 
     }, 
    }) 
</script> 

이것은 자바 스크립트 배열을 출력합니다. (console.log (arr)).

그래서이 배열을 반복하여 게시물을 표시 할 수 있습니까? 나는 Polymer에서 이것을 어떻게 만들지 모른다. 고맙습니다!

Answer 1

posts이라는 내부 속성을 설정하고 ayax 호출에 의해 반환 된 후에는 arr 값과 동일하게 설정해야합니다. 그런 다음 a repeat attribute on a template을 사용하여 게시물을 생성하십시오.

예 :

<polymer-element name="x-foo"> 
    <template> 
    <template repeat="{{post in posts}}"> 
     <h2>{{post.title}}</h2> 
    </template> 
    </template> 
    <script> 
    Polymer({ 
     created: function() { 
     this.posts = [{title: 'hello'},{title: 'world'}]; 
     } 
    }); 
    </script> 
</polymer-element> 

<x-foo></x-foo>