2

伙计们,我有一个关于更改父模板中的属性的简单问题。我写的代码如下:

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

该路由器创建以下路由:

  • 父母
  • 父索引
  • 父子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 回答