1

ルーターで作成したクラスを使用する場合Em.Application.create()は、application.create の外部でルーターを指定する必要があります。ただし、アプリケーションは自動的に初期化されるため、ルーターはルートにルーティングしません/。

autoinit: false以前は、application.createに追加することで、初期化を遅らせることができました。App.deferReadiness()これで、 andを使用することになっていますApp.advanceReadiness()。ただし、これは機能していないようです。

そして、私はあなたがそれを別の方法で行うことが「想定されている」という感覚から逃れることができないようです.

以下の問題を示すために最小限のコードを追加しました。ここにもjsfiddleがあります

編集：

どうやら、ember に新しいルーターがあるようで、ちょっと見落としていました。コードを新しいルーターに変更しましたが、まだ機能しないと思います:P

window.App = App = Em.Application.create({
    ApplicationController: Em.Controller.extend({}),

    ApplicationView: Em.View.extend({
        template: Em.Handlebars.compile('{{outlet}}'),
    }),

    ExtendedPatientController: Em.ObjectController.extend({}),

    ExtendedPatientView: Em.View.extend({
        classNames: ['patient-view', 'extended'],
        template: Em.Handlebars.compile('{{name}}')
    }),

    Patient: Em.Object.extend({
        name: undefined,
    }),
});

App.Router.map(function (match) {
  match('/').to('application', function (match) {
    match('/').to('extendedPatient');
  })
});

App.deferReadiness();

App.ExtendedPatientRoute = Em.Route.extend({
  setupController: function (controller) {
    controller.set('', App.Patient.create({
      name: "Bert"
    }));
  },
  renderTemplates: function () {
    this.render('extendedPatient', {
      into: 'application'
    });
  }
});

App.advanceReadiness();
4

2 に答える 2

3

あなたは実際、ここで必要以上に多くの仕事をしています。

サンプルを機能させるために必要なすべてのコードを次に示します。

テンプレート：

<script type="text/x-handlebars" data-template-name="index">
  <div class="patient-view extended">
    <p>Name: {{name}}</p>
  </div>
</script>

アプリ：

window.App = Em.Application.create();

App.Patient = Em.Object.extend({
  name: null
});

App.IndexRoute = Em.Route.extend({
  model: function() {
    return App.Patient.create({
      name: "Bert"
    });
  }
});

作業フィドルは次のとおりです。http://jsfiddle.net/NXA2S/23/

少し説明しましょう：

  • に行くと/、自動indexルートに入ります。そのルートの画面に何かを表示するために必要なことは、indexテンプレートを実装することだけです。起動して実行しているときにこれを行う最も簡単な方法は、テンプレートを に配置することですindex.html。後で、おそらくビルド ツールを使用することになるでしょう (詳細については、こちらの回答を参照してください)。
  • modelルート ハンドラのフックをオーバーライドすることで、ルートのテンプレートに表示されるモデルを制御できます。の場合index、ルート ハンドラはApp.IndexRouteです。この場合、モデルは新品App.Patientです。

おそらく、コントローラーとイベントを実装したいと思うでしょう。ルーターの詳細については、Ember.js Web サイトを参照してください。

于 2013-01-11T07:12:21.263 に答える
0

したがって、新しいルーターはこの問題を解決し、少し光沢を感じます.

最終的に、この基本的な例を実行する方法を見つけました。これは、ルーターで発生することです。

App.Router.map(function (match) {
  match('/').to('extendedPatient');
});

ビューで発生する必要があるのは次のとおりです。

ExtendedPatientView: Em.View.extend({
    classNames: ['patient-view', 'extended'],
    //You need to specify the defaultTemplate because you extend the view class
    //instead on initializing it.
    defaultTemplate: Em.Handlebars.compile('{{name}}')
}),

アプリの準備を延期する必要はありません。新しいルーターはそれを修正します.

また、ルートでは を指定する必要がないrenderTemplatesため、ルーターは次のようになります。

App.ExtendedPatientRoute = Em.Route.extend({
  setupController: function (controller) {
    controller.set('content', App.Patient.create({
      name: "Bert"
    }));
  },
});

http://jsfiddle.net/NXA2S/28/

于 2013-01-10T17:25:50.310 に答える