javascript - Enviando acción de componente a ruta en ember.js

Question

Aquí está la ruta:

import Ember from ''ember'';
export default Ember.Route.extend({
actions: {
closeModal: function () {
alert(''asdf'');
}
}
});

Y el código js componente:

import Ember from ''ember'';
export default Ember.Component.extend({
actions: {
closeModal: function () {
this.sendAction(''closeModal'');
}
}
});

Lo que me gustaría hacer es (como lo sugiere el código;)) enviar una acción de componente a ruta, para que la ruta pueda actuar en consecuencia. Sin embargo, el código anterior no funciona: el componente maneja la acción adecuadamente, pero la llamada sendAction dentro de su método no hace nada.

EDITAR:

Resolví este problema usando:

this._controller.send(''closeModal''); Dentro del método de acción del componente, sin embargo, esta solución no me satisface. Los autores de Ember dicen que los controladores se eliminarán en noviembre de 2.09, por lo que en mi código no quiero tener ninguna referencia a ellos. Sugerencias?

Answer 1

Un componente tiene un contexto aislado. Por lo tanto, no sabe nada de nada (ruta o controlador) fuera del componente. Para enviar una acción desde su componente a su ruta, debe pasar la acción de la ruta al componente en su plantilla de la siguiente manera:

// your template
{{your-component closeModal="closeModal"}}

Ahora, cuando llame a this.sendAction(''closeModal'') en su componente, activará la acción dada al componente dentro de su plantilla, que en este caso es la acción closeModal de su ruta.

Para obtener más información, consulte los documentos ( http://emberjs.com/api/classes/Ember.Component.html#method_sendAction )

ACTUALIZACIÓN agosto 3 2016

Para aquellos que encontraron acciones de cierre en versiones más recientes de Ember, también pueden hacer uso de tales acciones haciendo lo siguiente:

// your template
{{your-component closeModal=(action "closeModal")}}

Este asistente de acción apuntará a una acción de su controlador, en su componente puede llamar a this.attrs.closeModal() o this.get(''closeModal'')() para activar la acción en lugar de llamar a sendAction .

El beneficio de estas acciones es que la acción puede devolver un valor que se puede utilizar en el componente. En el caso de un modal, esto se puede usar, por ejemplo, para determinar si un modal se puede cerrar o no si se llama a closeAction , si devuelve false por ejemplo, puede decidir evitar que se cierre el modal.

Como nota al margen, las acciones de cierre siempre apuntan a su controlador, para permitir que apunte a una acción de ruta, puede echar un vistazo a este complemento: https://github.com/DockYard/ember-route-action-helper