2

私はF3に慣れていますが、backbone.jsを使用したまったく新しいものです。getリクエストでいくつかのパラメーターをリッスンし、バックボーンテンプレートを介してバックボーンビューでそれらを利用できるようにし、「正しい」方法で実行しようとしています。

これまでのところ、これが私が行っていることの簡略化されたバージョンです:

リクエストのURL:

http://myserver.com/route/?foo=12345

これが私のF3ルート処理コードです:

F3::route('GET /route', 'start');
function start() {
    F3::set('foo', pg_escape_string($_REQUEST["foo"]) );
    echo Template::serve('page.html');
}

foopage.htmlテンプレートで使用できるようにF3変数を設定しました。page.htmlには次のようなものがあります。

<script>
var foo = '{{@foo}}';
</script>

これで、JavaScriptのグローバル変数としてfoo paramを取得し、それをバックボーンビューに入れたいと思います。このビューのコンテンツには、バックボーンテンプレートが入力されています。

バックボーンビューには次のようなものがあります。

var fooView = Backbone.View.extend({
    el: '#foo-container',
    template: _.template(templates.foo),
    initialize: function() {
        this.render();
    },
    render: function() {
        this.$el.html(this.template( {foo:foo}  ));
    },
});

そして、これがバックボーンテンプレートに含まれているものです。

templates.foo = '\
Here is the value of foo in my template: <%= foo %>  \
';

最後に、見よ、#foo-container divはその中のデータを取得します(initializeもちろん実行した後)。

質問:もっと良い方法はありますか?これを行うためのより良い方法が必要です。データは2つの別々のテンプレート言語を通過します。

4

1 に答える 1

2

はい、もっと良い方法があります。Backbone は、サーバーから単一の HTML ページをロードし、その後のすべてのデータを JSON 応答本文とともに AJAX 経由でロードする単一ページ アプリケーション用に設計されています。Backbone.Modelサーバー側のリクエストを、正しい URL を持つとしてモデル化します。changeビューのレンダリングをモデルのイベントにバインドします。モデルを呼び出すmodel.fetch()と、AJAXGETリクエストが作成されます。JavaScript が埋め込まれた HTML の代わりに JSON データを送信するようにサーバー側のコードを変更すると、モデルは JSON を受信して​​解析し、JavaScript プロパティに変換してchangeイベントを発生させ、ビューがレンダリングされます。

于 2012-12-07T07:13:18.343 に答える