我怎样才能建立在灰烬递归看法?(How can I build a recursive view i

2019-07-31 22:58发布

在我的应用我有一个项目叫做可以包含由其他项目包含。 为了简单起见,可以说,这些模块可以无限嵌套。

我想知道我是否可以创建对应于同样嵌套块递归的意见。 每个视图将呈现为一个DIV包含了儿童和居住其父里面DIV

虽然意见是,他们可以包含什么样的条件类似,将从服务器获取它们的实际内容可以是不同的。 下面是一个例子的数据:

App.blocks.set('content',[
    Em.Object.create({title:"One", id:"1", is_inside:"0"}),
    Em.Object.create({title:"Two", id:"2", is_inside:"1"}),
    Em.Object.create({title:"Three", id:"3", is_inside:"0"}),
    Em.Object.create({title:"Four", id:"4", is_inside:"3"}),
    Em.Object.create({title:"Five", id:"5", is_inside:"4"})
])

在该例子中,块中的一个将被(假设0是根,这意味着没有任何其它块的内部)呈现为根。 块中的两个将呈现内区块之一,并依此类推。

我注意到一个类似的问题已经被问前一阵子,但我不是满意的答复那里。 我觉得必须有一个优雅的方式在Ember公司实现这一目标。

你能指出我的如何能在灰烬做一个例子吗? 如果没有,任何建议,可以帮助我取得进步和完善,我的问题也将非常赞赏。

编辑:这是一个的jsfiddle ,我和我们能为出发点用一些初始数据做出。 有了您的帮助,希望我可以让那些DIVs基于其is_inside关系嵌套。 我已经更新为使用这个简单的例子职位。

Answer 1:

以此为线索 ,我觉得layout的财产Ember.View来救援......是这样工作的

App.myView =  Ember.View.extend({
  layoutName: "parent",
  templateName: "child"
})

<script type="text/handlebars" data-template-name="parent">
  Who's your Daddy ??<br> {{yield}} <br> ######
</script>


<script type="text/handlebars" data-template-name="child">
  I'm your son !
</script>

将导致下面的HTML

<div id="ember1" class="ember-view">
  Who's your Daddy?
  <div id="ember-2" class="ember-view">
    I'm your son !
  </div>
  ######
</div>

第一个模型数据,然后使用forwhile循环在JS创建的意见,我不认为使用车把助手递归是一个好主意。

编辑节还有比这更好的办法......但检查了这一点,在这里你是不是限制嵌套到一个水平,对不对?

App.MainView = Ember.View.extend({
  templateName: "main"
})

App.View1 = Ember.View.extend({
  id: 1,
  templateName: "view1",
  parentId: "main"
})


App.View2 = Ember.View.extend({
  id: 2,
  templateName: "view2",
  parentId: 1
})


App.View3 = Ember.View.extend({
  id: 3,
  templateName: "view3",
  parentId: 1
})


App.View4 = Ember.View.extend({
  id: 4,
  templateName: "view4",
  parentId: 3
})

App.View5 = Ember.View.extend({
  id: 5,
  templateName: "view5",
  parentId: "main"
})

App.viewArray = [App.View1, App.View2, App.View3, App.View4, App.View5];

App.viewArray.forEach(view, function(){
  parentView = App.viewArray.findProperty("id", view.get('parentId'))
  view.set("layoutName", parentView.get('templateName'))
})


文章来源: How can I build a recursive view in Ember?