Uma das coisas que eu realmente amo no angularjs é sua maneira de controlar. Eles parecem ser widgets com seu próprio escopo e seu próprio comportamento.
Infelizmente, às vezes o projeto é tão grande que não é permitido mudar para um novo framework como esse, então criei este trecho para tornar possível carregar controladores em um show já em execução.
function initializeControllers(){
$('[js-controller]').each(function(index, el){
var controllers = ($(el).attr('js-controller') || '')
.replace(/s+/g, ' ')
.split(/s/);
if ($(el).data('jsControllersInitialized') === undefined){
$(el).data('jsControllersInitialized', []);
}
for (i = 0; i < controllers.length; i++){
if (controllers[i] === ''){ continue };
if ($(el).data('jsControllersInitialized').indexOf(controllers[i]) >=0 ){ continue };
eval("new " + controllers[i] + '(el)');
$(el).data('jsControllersInitialized').push(controllers[i]);
};
});
};
Agora, você pode inicializar os controladores a cada solicitação ajax em elementos que ainda não foram inicializados usando $(document).on('ajax:complete', function(e){ initializeControllers() });
jquery, por exemplo.
Aqui está um exemplo de seu uso:
html
<div js-controller='OneController SecondController'>
<a js-one-trigger>First action</a>
<a js-second-trigger>Second action</a>
</div>
café
class window.OneController
constructor: (el)->
@parent = $(el)
@parent.on('click', '[js-one-trigger]', @doThis)
doThis: =>
console.log 'This'
class window.SecondController
constructor: (el)->
@parent = $(el)
@parent.on('click', '[js-second-trigger]', @doThat)
doThat: =>
console.log 'That'
Felicidades!