0

私は現在 ember.js を学習していますが、非常に基本的な問題に悩まされています。アウトレットを使用して別のテンプレート内のテンプレートをレンダリングする方法が見つかりません。これらは私が持っているファイルです:

アプリケーション.ハンドルバー

<div class='navbar navbar-inverse navbar-fixed-top' role='navigation'>
    <div class='navbar-inner'>
        <div class='container'>
            <a class="brand" href="#">App</a>
            <div class='nav-collapse collapse'>
                <ul class='nav'>
                    <li>{{#linkTo 'application'}}Home{{/linkTo}}</li>
                    <li>{{#linkTo 'posts'}}Posts{{/linkTo}}</li>
                </ul>
            </div>
        </div>
    </div>
</div>
<div class='container' id='main'>
    <div class='content'>
        <div class='row'>
            <div class='span12'>
                <div class='page-header'></div>
                {{outlet}}
            </div>
        </div>
    </div>
</div>
</div>

ポスト.ハンドルバー:

    <ul>
{{#each controller}}
  <li>
  {{title}}
  </li>
{{/each}}
</ul>

投稿ルート:

App.PostsRoute = Ember.Route.extend({
    model: function() {

       return App.Post.find();
    }
});

ルーター.js:

App.Router.map(function() {
    this.route('posts',{ path: '/posts' }); 
    this.route('application',{ path: '/' }); 
});

アプリケーションをロードすると、ページは現在、ナビゲーション バーと空の白いページで表示されます。「投稿」リンクをクリックすると投稿テンプレートが表示されますが、投稿テンプレートが「アプリケーション」テンプレート全体を置き換えたかのようにナビゲーションが消えます。なぜこれが起こるのかを理解するのを手伝ってもらえますか?

4

1 に答える 1

0

内部的には を使用していますが、使用が競合を引き起こしApplicationRouteていると思います。this.route('application',{ path: '/' });

したがって、を削除するだけthis.route('application',{ path: '/' });ですべてが機能します。

ホームページ/初期ページが必要な場合は、index.handlebarsテンプレートを作成できます。これは、ember が自動的にthis.route('index',{ path: '/' });. に変更linkTo 'application'してlinkTo 'index'、期待される動作を取得します。

そのフィドルを見て、これが機能していることを確認してくださいhttp://jsfiddle.net/marciojunior/HpmwB/

于 2013-10-30T23:15:04.247 に答える