Question

我正在尝试将以下模型应用于车把模板以获得一个简单的列表，但我想数据层次结构或我试图循环数据的方式模型可能不正确。

data.js

{  
   "categories":[  
      {  
         "games":{  
            "action":{  
               "game":{  
                  "name":"Game 1",
                  "Description":"Description 1"
               },
               "game":{  
                  "name":"Game 2",
                  "Description":"Description 2"
               }
            }
         }
      },
      {  
         "movies":{  
            "fantasy":{  
               "movie":{  
                  "name":"Movie 1",
                  "Description":"Description 1"
               },
               "movie":{  
                  "name":"Movie 2",
                  "Description":"Description 2"
               }
            }
         }
      }
   ]
}

模板

<ul id="categories">
    <li> Games 
        <ul class="subcategories">
            {{#each categories}} 
                     ...........
            {{/each}} 
        </ul>
    </li>
</ul>

我想得到一个简单的清单（见下文）

<ul id="categories">
    <li> Games 
        <ul class="subcategories">
            <li> Action
                <ul>
                    <li>Game 1</li>
                    <li>Game 2</li>
                </ul>
            </li>
        </ul>
    </li>
    <li> Movies 
        <ul class="subcategories">
            <li> Fantasy
                <ul>
                    <li>Movie 1</li>
                    <li>Movie 2</li>
                </ul>
            </li>
        </ul>
    </li>
</ul>

非常感谢任何帮助。

Answer 1

您的数据结构并不能真正代表您的预期输出。结构应该是这样的：

data (object)
    categories (array)
        category (object)
            category name
            subcategories (array)
                subcategory (object)
                    subcategory name
                    items (array)
                        item (object)
                            item name
                            item description

注意：我调用了最里面的数组items而不是games/movies/etc，因此在模板中使用它更容易。

您可以在此jsfiddle中看到我的实施。

车把 - 无法循环数据

1 个答案: