javascript - Ember JS : ArrayController with Dynamic Segments (Router) but not Store

标签 javascript ember.js

我想知道如何构建一个“简单”的应用程序:

/photos/ (shows all photos – via ArrayController but without a remote service)
/photos/1  ... /photos/2  (shows one photo)

谁能提供最佳实践吗?

最佳答案

您必须定义一个与您想要的 url 匹配的路由:

App.Router.map(function() {
    // this will give you ~/#/photos
    this.route('photos') 
    // this will give you ~/#/photos/1 (or whatever number)   
    this.route('photo', { path: '/photos/:photo_id' }); 
});

这是一个示例:http://jsfiddle.net/schawaska/AabL8/

如果您想要执行嵌套 View ,例如显示拇指列表,并且当单击拇指时,您会在列表下方看到实际大小的图片,那么您必须通过使用嵌套的路线资源来执行稍微不同的操作像这样:

App.Router.map(function() {    
    this.resrouce('photos', function() {
        this.route('photo', { path: '/:photo_id' });    
    });
});

如果您这样做,则必须在“照片”模板中添加 {{outlet}} 并在负责单个照片对象的类的名称中添加 Photos

  • PhotoRoute 变为 PhotosPhotoRoute
  • data-template-name="photo" 变为 data-template-name="photos/photo"

这是一个示例:http://jsfiddle.net/schawaska/JfRbf/

关于javascript - Ember JS : ArrayController with Dynamic Segments (Router) but not Store,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15279817/

相关文章:

knockout.js - 使用 Knockout 和 Ember 而不是 Handlebars

javascript - 文本对齐 HTML 和 CSS

javascript - 主干事件触发顺序

javascript - 如何使用 Angular.js 禁止仅将字符输入输入字段

javascript - Ember.js 在特定页面上包含外部脚本

ember.js - 使用 ember.js 进行 A/B 测试

javascript - 子窗口关闭时如何运行父窗口的功能?

javascript - 如何减少谷歌图表功能代码?

ember.js - 在可能保存模型时处理 ember-data 中的自定义服务器端错误

ember.js - Ember : this. modelFor 不是一个函数(在组件中)