Loop Wordpress Articles in Polymer

Loop Wordpress Articles in Polymer

本文关键字：Polymer in Articles Wordpress Loop      更新时间：2023-09-26

我想写一个聚合物元素来显示一些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>

这将输出一个 JavaScript 数组。（控制台.log（arr））。

那么如何循环这个数组来显示帖子呢？我不知道如何在聚合物中做到这一点。谢谢！

您应该设置一个名为 posts 的内部属性，然后在 ajax 调用返回后将其设置为等于 arr 的值。然后在模板上使用重复属性来生成帖子。

前任：

<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>
相关文章：