0

これは、動的セグメントを持つ投稿に子ルートがある場合に、URLを/postsに正しく更新しない基本的な残り火ルーティングの例です。他のすべてのルート(動的セグメントを含む)は、URLを正しく更新します。動的セグメントの子ルート(「posts」の下の「show」と呼ばれます)を取得すると、URLが正しく更新されます。これがフィドルコードです:http://jsfiddle.net/inconduit/NbPpM/3/

また、URLが更新されるフィドルの動作を確認するには、http://fiddle.jshell.net/inconduit/NbPpM/3/show/#を参照してください。

要約すると、[投稿]をクリックすると、URLが更新されて/ postsが表示されますが、そうではありません。

これがjavascriptです:

App = Ember.Application.create({
ready: function() {
        App.initialize(App.Router.create({ enableLogging: true }));
    }
});

App.Post = Ember.Object.extend({
    title: null,
    body: null
});

App.posts = [];
App.posts.pushObject(App.Post.create({id:'0', title: "Test post 1", body: "How awesome is Ember.js"}));
App.posts.pushObject(App.Post.create({id:'1', title: "Test post 2", body: "I love working on awesome projects"}));
App.posts.pushObject(App.Post.create({id:'2', title: "Test post 3", body: "I like cats"}));

App.ApplicationController = Ember.ObjectController.extend();
App.ApplicationView = Ember.View.extend({
    templateName: "application_view"
});

App.PostsController = Ember.ArrayController.extend();
App.PostsView = Ember.View.extend({
    templateName: 'posts_view'
});

App.PostController = Ember.ObjectController.extend();
App.PostView = Ember.View.extend({
    templateName: 'post_view'
});

App.AboutController = Ember.ObjectController.extend();
App.AboutView = Ember.View.extend({
    templateName: 'about_view'
});

App.Router = Ember.Router.extend({

    root: Ember.Route.extend({
        goToPostsIndex: Ember.Route.transitionTo('posts.index'),
        goToAbout: Ember.Route.transitionTo('about'),
        goToShowPost: Ember.Route.transitionTo('posts.index.show'),

        index: Ember.Route.extend({
            route: '/',
            redirectsTo: "posts.index"
        }),

        posts: Ember.Route.extend({

            route: '/posts',
            connectOutlets: function (router) {
                    router.get('applicationController').connectOutlet('posts', App.posts);
                },
            index: Ember.Route.extend({
                route: '/',
                connectOutlets: function (router) {
                    router.get('applicationController').connectOutlet('posts', App.posts);
                },
                show: Ember.Route.extend({
                    route: '/:post_id',

                    connectOutlets: function (router, post) {
                        router.get('postsController').connectOutlet('post', post);
                    },
                    deserialize: function(router, params) {

                        var id = params.post_id,
                            i = 0;
                        for (i = 0; i < App.posts.length; i += 1) {
                            if (App.posts[i].id === id) {
                                return App.posts[i];
                            }
                        }
                    },
                    serialize: function(router, context) {
                        var rtnVal = {},
                            id = context.get('id');
                        if (context) {
                            rtnVal = {post_id: id};
                        }

                        return rtnVal;
                    }
                })
            }),
        }),

        about: Ember.Route.extend({
            route: '/about',
            connectOutlets: function (router) {
                router.get('applicationController').connectOutlet('about');
            }
        })
    })
});

``

4

1 に答える 1

1

リーフルートのみがナビゲート可能であることが意図されています(つまり、posts.indexがナビゲートできなかった理由は、子ルートがあったためです)。

http://jsfiddle.net/NbPpM/8/ 私はposts.index.showをposts.showに移動しました-少なくとも私の経験では、ここにある方法は一般的なパターンです。

于 2012-08-15T23:26:34.530 に答える