2

親テンプレート内のプロパティの変更について簡単な質問がありました。私が書いたコードは以下のとおりです。

App.Router.map(function () {
  this.resource('parent' , { path: "/parent" }, function() {
   this.route('child1');
   this.route('child2');
   this.route('child3');
});

このルーターは、次のルートを作成します。

  • 親.index
  • 親.子1
  • 親.子2
  • 親.子3

以下は私のテンプレートです(簡略化)

<script type="text/x-handlebars" data-template-name="application">
{{outlet}}
</script>

<script type="text/x-handlebars" data-template-name="parent">
  <h1>{{title}}</h1>

  Common html

  {{outlet}}
</script>

<script type="text/x-handlebars" data-template-name="parent/index">
  Parent specific content
</script>

<script type="text/x-handlebars" data-template-name="parent/child1">
  Child 1 specific content
</script>

<script type="text/x-handlebars" data-template-name="parent/child2">
  Child 2 specific content
</script>

<script type="text/x-handlebars" data-template-name="parent/child3">
  Child 3 specific content
</script>

そして、ここに私のコントローラーがあります

App.ParentController = Ember.Controller.extend({
  title: 'Parent Title'
});

App.ParentIndexController = Ember.Controller.extend({
  title: 'Parent Index Title'
});

App.Child1Controller = Ember.Controller.extend({
  title: 'Child 1 Title'
});

App.Child2Controller = Ember.Controller.extend({
  title: 'Child 2 Title'
});

App.Child3Controller = Ember.Controller.extend({
  title: 'Child 3 Title'
});

子コントローラー内にいるときに、template="parent" 内の {{title}} プロパティを更新するにはどうすればよいですか? 私はこのようなことを試しました

App.Child3Controller = Ember.Controller.extend({
  needs: ['parent'],
    init: function() {
    this.get('controllers.parent').set('title', 'Child 3 Title');
  }
});

ただし、親テンプレートは更新しません。では、どうすればこれを達成できますか?

4

2 に答える 2

3

わかりました、コメントの後に私の回答を編集します。あなたが直面している問題は、initfromChild3Controllerが必要なときに呼び出されないことです。これを機能させるには、parent.child3ルートsetupControllerフックでそれを行う必要があります:

App.ParentChild3Route = Ember.Route.extend({
  setupController: function(controller, model) {
    // the Ember.run.later is not necessary and is only to simulate a delay 
    // so you can actually see the title change, it would be actually
    // just fine to call this.controllerFor('parent').set('title', 'Child 3 Title');
    // directly when the setupController hook is invoked
    Ember.run.later(this, function() {
      this.controllerFor('parent').set('title', 'Child 3 Title');
    }, 1500);
  }
});

parent.child3また、ルートからルートにリダイレクトしてindexフックを実際に起動させていますが、これは他の方法でルートにsetupController移動するだけでも発生する可能性があります。parent.child3

App.IndexRoute = Ember.Route.extend({
  afterModel: function() {
    this.transitionTo('parent.child3');
  }
});

結論として、コントローラーの値の変更setupControllerは、コントローラーに対応するルートのフックで行う必要があります。

簡単なデモでこれをシミュレートしようとしました。見てください。

それが役に立てば幸い。

于 2013-08-21T13:15:36.047 に答える
0

みんな、返信ありがとう!皆さんが私にアイデアをくれて、私の質問を解決しました:) ここでそれをチェックしてくださいjsbin.com/AhOT/3 ご覧のとおり、私はそれを解決するために別の方法を取りました ;)

于 2013-08-21T21:38:54.847 に答える