当前位置: 动力学知识库 > 问答 > 编程问答 >

javascript - Ember.js action bubbles up and skips a route

问题描述:

Setup

Imagine an Ember.js app (tried v1.13.9) with this structure:

  1. ApplicationRoute
  2. IndexRoute
  3. IndexController

On the index template, there's simply a button with an action:

<!-- index/template.js -->

<button {{action 'ping' 'index template'}}>index</button>

All routes/controllers handle this action, printing out a message and passing the action up until it reaches ApplicationRoute. Eg, for IndexRoute it is:

// excerpt from index/route.js

actions: {

ping(from) {

console.log('IndexRoute^ping from', from);

return true;

}

}

This same action can also originate at IndexController:

// excerpt from index/controller.js

thingsHappen() {

this.send('ping', 'index controller');

}

You can see the code and play with it at these URLs:

  • See the Github gist: https://gist.github.com/pablobm/8fa2b8ae36e875cb9944
  • Play with the twiddle: http://ember-twiddle.com/8fa2b8ae36e875cb9944

Question

When you press the button, the messages show that the action is seen by all three routes/controllers, in order, from the inside bubbling up. However, when the action is sent from IndexController, it skips IndexRoute. Why is this?

网友答案:

It's related to the fact that the route hasn't truly been transitioned to yet. So the index route isn't part of the current chain. If you want to make sure the index route has been loaded you can hook up to the transition promise and wait for it to complete before calling your action.

 setupController(controller, model, transition) {
    controller.wake('non attached');
    transition.then(function(){
      controller.wake('attached');
    });
  },

http://ember-twiddle.com/e36c0228967fb4485d27

分享给朋友:
您可能感兴趣的文章:
随机阅读: