如何在Polymer中重复嵌套的JSON值?

时间:2016-07-24 20:35:17

标签: json polymer-1.0

这是我的JSON文件 -

    {
      "patterns": 
      [
        {
          "name": "Nigel",
          "desc": "As more screen space is available, side navigation can transform into tabs.",
          "demoUrl": "patterns/transform-navigation/",
          "sourceUrl": "https://github.com/PolymerElements/app-layout/tree/master/patterns/transform-navigation/x-app.html",
          "pokemons": 
          [
            { "id": "01", "name": "pikachu" },
            { "id": "02", "name": "bulb" }
          ]

        },
        {
          "name": "Omkar",
          "desc": "Content cards may expand to take up more horizontal space.",
          "demoUrl": "patterns/expand-card/",
          "sourceUrl": "https://github.com/PolymerElements/app-layout/tree/master/patterns/expand-card/index.html",
          "pokemons": 
          [
            { "id": "01", "name": "staryu" },
            { "id": "02", "name": "squirtle" }
          ]
        },
        {
          "name": "Sudipto",
          "desc": "Content cards may expand to take up more horizontal space.",
          "demoUrl": "patterns/expand-card/",
          "sourceUrl": "https://github.com/PolymerElements/app-layout/tree/master/patterns/expand-card/index.html"
        }
      ]
}

这是我的Polymer Element,名为list-search -

<dom-module id="list-search">
<template>

    <iron-ajax url="list-search-data.json" auto last-response="{{data}}"></iron-ajax>

    <input type="text" value="{{filterVal::input}}">

    <template is="dom-repeat" items="{{data.patterns}}" filter="{{_filter(filterVal)}}" as="main">  
          <br/>
          <paper-item>{{main.name}}</paper-item>

          <template is="dom-repeat" items="{{main.pokemons}}"  as="sub">  
              <paper-item> &nbsp; &nbsp; {{sub.name}}</paper-item>
          </template> 

    </template> 

</template>

<script>

    Polymer({
    is: "list-search",

    _filter: function(val) {  
      return function(person) {

        if (~person.name.indexOf(val)) {
          return person.name;
        }

      };
    }

    });

</script>

</dom-module>

如果我搜索Nigel,Omkar或Sudipto,那么过滤器工作正常。它会根据需要显示搜索结果。

但我想实现以下想法 -

如果我搜索皮卡丘,它会显示父母以及孩子示例:( Nigel pikachu)

关于如何搜索孩子和显示父母+孩子的任何想法?

0 个答案:

没有答案