1

我刚开始使用 Ember.js。我让 Ember Data 与我的 Rails 后端对话，目前正在使用基本的车把模板显示数据。数据按应有的方式呈现。目前coffescript中的代码如下：

模型：

App.Post = DS.Model.extend
  title: DS.attr('string')
  text: DS.attr('string')
  imageUrl: DS.attr('string')

路由：App.Router.map -> @route 'posts'，路径：'/'

App.PostsRoute = Ember.Route.extend
  model: -> App.Post.find()

帖子.车把：

<div id="masonry-container" class="transitions-enabed infinite-scroll clearfix centered">
  {{#each controller}}
    <div class="col2 box">
     <h3>{{title}}
     <img {{bindAttr src="imageUrl"}} >
     <p class="text">
      {{text}}
     </p>
   </div>
 {{/each}}
</div>

应用程序.handlebars

{{outlet}}

该模板将在整个应用程序的多个地方使用。它还使用了需要在渲染内容后初始化的砌体，最后我需要实现无限滚动，尽管这有点超前了。

现在我想采用上面的方法并为它创建一个视图。到目前为止，我已经尝试了以下方法。

路由：

App.Router.map ->
  @route 'posts', path: '/'

App.PostsRoute = Ember.Route.extend
  setupController: ->
    @controllerFor('posts').set('content'. App.Content.find())

控制器：

App.PostsController = Ember.ArrayController.extend()

看法：

App.PostsView = Ember.View.extend
  layoutName: 'appLayout'
  templateName: 'posts'
  controller: 'App.PostsController'

模板：

app_layout.handlebars

...layout mark up...
 <div id="container">
   {{yield}}
 </div>
...more layout mark up...

帖子.车把：

<div id="masonry-container" class="transitions-enabed infinite-scroll clearfix centered">
  {{#each controller.content}}
    <div class="col2 box">
     <h3>{{title}}
     <img {{bindAttr src="imageUrl"}} >
     <p class="text">
      {{text}}
     </p>
   </div>
 {{/each}}
</div>

应用程序.handlebars

{{view App.PostsView}}

使用此代码，布局呈现，但没有任何帖子。似乎控制器的内容属性没有设置，但我不确定我是否可能遗漏了其他东西。任何帮助，将不胜感激。

4

1 回答 1

1

我想通了。问题在于调用{{view App.PostsView}}。将我的 application.handlebars 改回 using{{outlet}}解决了这个问题。似乎尝试显式渲染视图会导致问题，并且通过使用正确的命名约定定义视图，Ember 会自动选择它。事后看来，考虑到 Ember 方式，这很有意义。

于 2013-08-26T17:32:17.790 回答