一些H1标题

Question

我应该将ember.js用于项目。我正在将json转换为HTML视图。 json看起来像这样：

{
"title": "Some H1 title",
"children": [
    {"title": "Some H2 title",
    "children": .....
    }
]
}

所以结果应该是这样的

一些H1标题

一些H2标题

如果它是动态的把手或静态无关紧要。

建议使用emberjs的方法是什么？将整个json加载到数据模型中并从那里开始？或者只是将物体放在车把上？（顺便说一下，需要一些基本的if else逻辑，因此最后一个选项可能不是最好的（例如需要更多代码））。

Answer 1

如果json中的数据在应用程序的数据模型中有一些含义，那么您应该将它放在ember对象的结构中并将它们分配给控制器的属性。如果您只需要显示json数据并且在应用程序的数据模型中没有任何意义，那么您可以直接将其作为属性分配给视图或控制器。

在所有情况下，您都需要一个把手模板，该模板将显示存储在这些属性中的数据。

例如，如果您的json数据由字符串为title的对象和与children相同的对象的数组组成，并且您希望显示所有子项的所有标题，而不管您的深度如何可以做点什么，

http://emberjs.jsbin.com/UgaVAvIZ/1/edit

<强> HBS

<script type="text/x-handlebars">
    {{outlet}}
  </script>

  <script type="text/x-handlebars" data-template-name="index">
    <h1>{{title}}</h1>
    {{partial "childrenPartial"}}
  </script>

  <script type="text/x-handlebars" data-template-name="_childrenPartial">
    {{#each child in children}}
    <h2>{{child.title}}</h2>
    {{#with child.children}}
    {{partial "childrenPartial"}}
    {{/with}}
    {{/each}}
  </script>

<强> JS

App = Ember.Application.create();

App.Router.map(function() {
  // put your routes here
});

App.IndexRoute = Ember.Route.extend({
  model: function() {
    return {"title": "Some H1 title","children": [{"title": "Some H2 title","children": []}]};
  }
});

请注意，使用如图所示的部分仅是许多其他方法中的一种。在这种方法中，json数据已被指定为特定路径的模型，并借助于部分显示所需数据的相应视图。

Ember.js通过迭代从json生成html

一些H1标题

一些H2标题

1 个答案: