2

私は次のコードを持っています。（現在、アプリケーションには約500行あるため、ルーターをコピーします）必要なのは、状態「rooms」から「guests.new」に切り替えることです。

部屋の状態になると、状態を「newGuest」画面に変更するためにアクション「newGuest」を呼び出すテンプレートが読み込まれます。しかし、私はそれを機能させることができません。ファイアバグでこのエラーが発生します：

g[a] is undefined

これがルーターコードです。あなたが私を助けてくれることを願っています。

App.Router = Ember.Router.extend({
        enableLogging:true,
        location:'hash',
        gotoRooms:Ember.Route.transitionTo('rooms.index'),
        gotoGuests:Ember.Route.transitionTo('guests.index'),
        gotoBookings:Ember.Route.transitionTo('bookings'),
        gotoHome:Ember.Route.transitionTo('root.index'),

        root:Ember.Route.extend({
            index:Ember.Route.extend({
                route:'/',
                connectOutlets:function (router) {
                    App.HomeView.appendTo('#main-content .container_12');
                },
                enter: function(){
                    console.log('Entro Home');
                },
                exit: function(){
                    App.HomeView.remove();
                }
            }),
            guests:Ember.Route.extend({
                route:'/guests',
                index:Ember.Route.extend({
                    route:'/',
                    connectOutlets:function(router) {
                        App.GuestsView.appendTo('#main-content .container_12');    
                    },
                    enter: function(){
                        console.log("Entro Guests");
                    },
                    exit: function(){
                        App.GuestsView.remove();
                    },
                }),
                new:Ember.Route.extend({
                    route:'/new/:bed',
                    deserialize: function(manager, params) {
                        console.log('New Guest \nBed:'+params['bed']+"\n Date:"+params['date']);
                        App.GuestView.appendTo('#main-content .container_12');
                    },
                    connectOutlets:function(){
                        alert("hola");
                    },
                    exit: function(){
                        App.GuestsView.newGuestView.remove();
                    }
                })
            }),
            rooms:Ember.Route.extend({
                newGuest:Ember.Route.transitionTo('guests.new'),
                route:'/rooms',
                index:Ember.Route.extend({
                    route:'/',                    
                    connectOutlets:function(router) {
                        App.RoomsView.appendTo('#main-content .container_12');    
                    },
                    enter: function(){
                        console.log("Entro Rooms");
                    },
                    exit: function(){
                        App.RoomsView.remove();
                    }
                })
            })
        })
    });

@Akashに感謝しますが、それでも機能しません。私はember-1.0.preを使用しています。'newGuest'を呼び出すテンプレートは次のとおりです。

  <script type="text/x-handlebars" data-template-name="rooms">
      {{#each room in App.Rooms}}
        <div class="grid_4">
      <div class="block-border">
        <div class="block-header">
          <h1>{{room.screen}}</h1><span></span>
        </div>
        <div class="block-content">
          <ul class="block-list">
          {{#each bed in room.camas}}
            {{#if bed.guestId}}
            <li {{action "viewGuest" on="click"}} class="occupied">{{bed.id_guest}}</li>
            {{else}}
            <li class="free" {{action "newGuest" on="click"}}>Free Bed</li>
            {{/if}}
          {{/each}}
          </ul>
        </div>
      </div>
    </div>
      {{/each}}
    </script>

以前のバージョンではルーティングの問題が発生したことをさまざまなスレッドで読んだので、ember-latestも試してみました。ember-latestでは、計算されたプロパティを定義できないことがわかりました。少なくとも、ページをロードするときにコンソールにポップアップ表示されるのはそれです。

どんな手掛かり？

どうもありがとう！

4

1 に答える 1

1

guests問題は、Emberがルート内からルートにアクセスできないことですrooms。したがって、アクション関数をツリーの下に移動する必要があります。私はあなたのコードを少し下に微調整しました：

微調整されたコード：

App.Router = Ember.Router.extend({
        enableLogging:true,
        location:'hash',
        gotoRooms:Ember.Route.transitionTo('rooms.index'),
        gotoGuests:Ember.Route.transitionTo('guests.index'),
        gotoBookings:Ember.Route.transitionTo('bookings'),
        gotoHome:Ember.Route.transitionTo('root.index'),

        root:Ember.Route.extend({
            newGuest:Ember.Route.transitionTo('guests.new'),
            index:Ember.Route.extend({
                route:'/',
                connectOutlets:function (router) {
                    App.HomeView.appendTo('#main-content .container_12');
                },
                enter: function(){
                    console.log('Entro Home');
                },
                exit: function(){
                    App.HomeView.remove();
                }
            }),
            guests:Ember.Route.extend({
                route:'/guests',
                index:Ember.Route.extend({
                    route:'/',
                    connectOutlets:function(router) {
                        App.GuestsView.appendTo('#main-content .container_12');    
                    },
                    enter: function(){
                        console.log("Entro Guests");
                    },
                    exit: function(){
                        App.GuestsView.remove();
                    },
                }),
                new:Ember.Route.extend({
                    route:'/new/:bed',
                    deserialize: function(manager, params) {
                        console.log('New Guest \nBed:'+params['bed']+"\n Date:"+params['date']);
                        App.GuestView.appendTo('#main-content .container_12');
                    },
                    connectOutlets:function(){
                        alert("hola");
                    },
                    exit: function(){
                        App.GuestsView.newGuestView.remove();
                    }
                })
            }),
            rooms:Ember.Route.extend({
                route:'/rooms',
                index:Ember.Route.extend({
                    route:'/',                    
                    connectOutlets:function(router) {
                        App.RoomsView.appendTo('#main-content .container_12');    
                    },
                    enter: function(){
                        console.log("Entro Rooms");
                    },
                    exit: function(){
                        App.RoomsView.remove();
                    }
                })
            })
        })
    });
于 2012-12-29T08:37:43.300 に答える