Question

Ey们我有一个关于更改父模板中的属性的简单问题。我写的代码如下所示：

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

此路由器创建以下路由：

父
parent.index
parent.child1
parent.child2
parent.child3

以下是我的模板（简化）

<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 =＆＃34; parent＆＃34;中更新{{title}}属性？当我在儿童控制器内？我尝试过像这样的事情

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

但我没有更新父模板。那我该怎么做呢？

Answer 1

好的，在您的评论后编辑我的答案，您遇到的问题是来自init的{{1}}在您需要的时候没有被调用，所以要实现这一点，您应该在Child3Controller路由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挂钩实际触发，但这也可以通过导航到{{1}来实现以任何其他方式路由：

setupController

总而言之，更改控制器中的值应该在控制器对应路径的parent.child3挂钩中完成。

我试图用一个简单的demo模拟这个，看看。

希望它有所帮助。

Answer 2

伙计们感谢所有回复！你们给了我一个想法，它解决了我的问题:)在这里查看jsbin.com/AhOT/3你可以看到我采取了另一种方式来解决它;）

Ember.js：更新父模板属性

2 个答案: