バインド/オブザーバに関するデータのクエリサーバ

Question

痛いほど明白な答えがありますが、私はJSとEmberの両方であり、私が一般的なシナリオだと思う解決策を見つけるのが苦労します。基本的には、html/css/jsのフロントエンドと公開されたREST APIを持つJavaのバックエンドを持つ複数ページのアプリケーションがあります。 1つのapp.jsファイルがすべての画面と複数のコントローラに含まれていますが、そのうちのいくつかは個々の画面にのみ適用されます。

編集：私の質問を忘れました。私の質問は、コントローラにオブザーバが付いてくるまで、ユーザデータのクエリをサーバに遅らせる方法です。コントローラは複数の画面に存在しているため、無駄になるためオブジェクトの作成を盲目的に問い合せることは望ましくありません。今のところ私はポピュレートメソッドと呼ばれるページのインラインスクリプトタグの最後にどこかでハッキングの方法があります。以下は私のコードが現在どのように見えるかです。

app.jsのセクション：index.htmlを

<script type="text/x-handlebars"> 
     Welcome, {{App.userController.content.fullname}} 
</script> 

....other code.... 
<script type="text/javascript"> 

    $(document).ready(function() { 
      ....other code.... 
      App.userController.populate(); 
    }); 
</script> 

の

App = Ember.Application.create(); 

User = Ember.Object.extend({ 
    username: 'empty', 
    fullname: 'empty user' 
}); 

App.UserDataSource = Ember.Object.extend({ 

    fetchMyUser: function(callback) { 
     $.get('ncaa/user', function(data) { 
      callback(User.create({ 
        username: data.username, 
        fullname: data.fullname})); 
     }); 
    } 
}); 

App.userDataSource = App.UserDataSource.create(); 

App.UserController = Ember.Object.extend({ 

    content: null, 

    populate: function() { 
     var controller = this; 
     this.get('dataSource').fetchMyUser(function(data) { 
      controller.set('content', data); 
     }); 
    } 
}); 

App.userController = App.UserController.create({ 
    dataSourceBinding: Ember.Binding.oneWay('App.userDataSource') 
}); 

Ember.run.sync(); 

セクション私は私の最初のステップは、ハンドルバーのテンプレートがEmber.Viewを延長することを修正しますかなり確信しているが、希望コミュニティがベストプラクティスと信じていることを知る。また、1つのapp.jsファイルにすべてを入れてみるのは間違っていますか？ユーザーが表示する必要がある画面でのみインポートされた場合は、コントローラの作成時にクエリを実行すると問題ありません。

Answer 1

私の質問に対する回答は、Ember.Viewで終了しました。基本的には、自分のビューのinit関数をオーバーライドして、必要なコントローラにデータを取り込むための呼び出しを追加します。ビューは、ハンドルバーのテンプレートを介してインスタンス化されているので、不必要なコールやハックを回避することはできません。以下の重要な変更。

Index.htmlと：

<script type="text/x-handlebars"> 
    {{#view App.UserNameView }} 
     Welcome, {{fullName}} 
    {{/view}} 
</script> 

App.js：

App.UserNameView = Em.View.extend({ 
    init: function() { 
      this._super(); 
      App.userController.populate(); 
    }, 
    fullNameBinding: 'App.userController.content.fullname', 
    userNameBinding: 'App.userController.content.username' 
});