javascript - EmberJS：具有动态段（路由器）但不存储的 ArrayController

Question

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

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

任何人都可以提供最佳实践吗？

Answer 1

您必须定义与您想要的 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/

如果您想做嵌套视图，例如显示缩略图列表，当单击缩略图时，您会在列表下方看到其实际大小的图片，那么您必须使用路由资源进行稍微不同的操作，嵌套如下：

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/