4

我仍在努力学习 ember.js,所以请多多包涵。

客观的

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

每个 div 都会关联一个点击事件,因此当用户点击链接时,会弹出一个对话框。

代码

索引.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>

我的 app.js 文件在这里:

App = Ember.Application.create();

App.Router.map(function() {

});

App.IndexRoute = Ember.Route.extend({
  model: function() {
    return ['Payload_1', 'Payload_2', 'Payload_3'];
  }
});

App.PayloadsRoute = Ember.Route.extend({
   model: function() {
    return ['Payload_1', 'Payload_2', 'Payload_3'];
  } 
})


  App.IndexController = Ember.ObjectController.extend(
    {
        click: function(e)
        {
            alert("clicked:" + e);

        }
    })

大概的概念

上面的当前代码将创建具有 3 个 div 的“theaterDialogue”div 框。一个 onclick 动作通过控制器与每个 div 相关联。当用户单击第一个 div “payload 1”时,将在警报框中打印第二个 div “payload 2”等。我希望能够呈现一个新对话框(jquery 对话框),而不是打印出来内容将从模板呈现。我不清楚这是如何完成的……我知道视图用于存储模板的数据……但不知道如何将模板嵌套在由操作生成的模板中?

如果你能指点我,那就太棒了!

任何建议表示赞赏,D

4

1 回答 1

6

嵌套的基本方法是,

  • 定义嵌套路由(主要步骤,如果你做对了,你就快到了)
  • {{outlet}}如果您认为此视图稍后会附加一些内容,请 添加模板

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

一个
|_B
  |_C

然后模板 A & B 应该有{{outlet}},而 C 是它不应该有的最后一个{{outlet}}

一个很好的例子

于 2013-04-05T13:11:46.780 回答