0


我正在建立一个简单的图片库。目前我坚持使用 nextImage 方法。
我期望的是一个模型ID列表。所以我只是增加#nextImage 中的id。

  • #/照片/1
  • #/照片/2
  • #/照片/3

但是 emberjs 使用“随机”ID 作为 URL

  • 照片/ember283
  • 照片/ember352

问题：如何从一个图像链接到下一个图像

这就是我在其中一个控制器中创建记录的方式

//...
record = App.Photo.createRecord
      src : dataUrl
      title : "sometitle"

record.store.commit();

photo_controller

App.PhotoController = Ember.ObjectController.extend
  nextImage : ->
    length = App.Photo.find().get('length')
    id = parseInt(@get "content.id")
    nextId = if id == length then 1 else id+1

    @transitionToRoute 'photo', App.Photo.find(nextId)

列出照片的模板

{{#each photo in controller}}
    <div style="margin: 5px">
        {{#linkTo photos.photo photo}}
        <img width="100" heigth="100"
        {{bindAttr src="photo.url"
        alt="photo.title"
        title="photo.title"}} />
        {{/linkTo}}
    </div>
{{/each}}

一张照片的模板

   <a href="#" {{action nextImage}}>
    <img {{bindAttr src="url"}} />
        {{title}}
   </a>

应用路由器

App.Router.map ->
  @route "start"
  @route "photos"
  @route "photo",
    path: "/photos/:photo_id"

店铺

App.Store = DS.Store.extend
  revision: 12,
  adapter: 'DS.FixtureAdapter'
4

1 回答 1

0

我认为问题在于您对正在创建的 ID 有假设。nextImage 的这个替代实现怎么样？

App.PhotoController = Ember.ObjectController.extend({
    needs : ["photos"], //will be accessible via 'controllers.photos'
    nextImage : function(photo){
        var pc = this.get("controllers.photos"); //get the photos controller
        var indexOf = pc.indexOf(photo);
        var next = null;
        if(indexOf + 1 === pc.get("length"))
            next = pc.objectAt(indexOf +1);
        else
            next = pc.objectAt(0);
        this.get("target").send("photo", next);

    }
});

它是如何工作的？ 通过需求属性，您可以访问照片控制器。现在我正在使用光控制器来确定下一张要显示的照片。如果您使用 REST-Adapter，这具有额外的优势，您不必发出额外的请求。

于 2013-03-10T17:42:34.213 回答