Templates ember.js和嵌套模板/视图

我还在努力学习ember.js，所以请耐心听我说

客观的 我目前正在创建一个单页web应用程序。当应用程序启动时，应用程序将执行一个ajax调用，该调用将返回一个数字列表。应用程序将处理这些数字，并为每个数字创建一个div，并将其存储到div容器中

单击事件将与每个div关联，因此当用户单击链接时，将出现一个弹出对话框

代码 Index.html

 <script type="text/x-handlebars">
            <h2>Welcome to Ember.js</h2>
            {{outlet}}

        </script>

        <script type="text/x-handlebars" data-template-name="payloads"> 
            <div class="page">
                <div id="desktopWrap">
                    <div id="theaterDialog" title="Theater View" class="bibWindow1">
                            {{view.name}}
                    {{#each item in model}}
                        <div {{bindAttr id="item"}} {{action click item}}>
                            <div class="thumb1" ></div>
                            <div class="userDetails1">Payload {{item}}</div>
                            <div class="online1" ></div>
                        </div>
                        <div class="spacer10"></div>
                    {{/each}} 
                    </div>
                </div> 
            </div>
        </script>

总体思路 上面的当前代码将创建带有3个div的“theaterDialogue”div框。一个onclick操作通过这些div的控制器与之关联。当用户单击第一个div“payload 1”时，将在警报框中打印，第二个div“payload 2”等。我希望能够呈现一个新的对话框（jquery对话框），其中内容将从模板中呈现。我不清楚这是如何做到的……我知道视图用于存储模板的数据……但不知道如何将模板嵌套在由操作生成的模板中

如果你能告诉我任何人，那就太棒了

感谢您的建议，

---

D

嵌套的基本方法是

• 定义嵌套管线（主要步骤，如果你做对了，你就快到了）
• 如果您认为此视图稍后将附加某些内容，请在模板中添加

  {{outlet}

例如，我们有3个视图A、B、C，嵌套如下

A |_B |_C A. |_B |_C 然后模板A和B应该有

{outlet}

，而C是最后一个不应该有

{outlet}

---

好的

我真的很喜欢这个例子+1感谢您的回复。然而，我并不认为我在寻找什么。在您给出的示例中，{{outlet}}只会根据单击的链接更新数据库。然而，我希望它能同时启动。示例：用户加载页面时，看到一个带有三个div的弹出窗口。可以单击每个div，并显示包含新数据的新弹出窗口。用户可以关闭每一个弹出窗口，但您可以大致了解。此外，我认为我没有得到视图和模板之间的区别。一个视图可以有多个模板吗？在这个例子中，我只想给你一个嵌套需要采取的基本方法，这样你就可以利用这个理解为你的用例找到解决方案。关于视图和模板，一个视图只能有一个模板，模板只是一个特定视图的html内容，更多关于视图 A |_B |_C