2016-12-23 2 views
0

У меня есть шаблон Внутренний шаблон B. Когда нажата кнопка B внутри шаблона B, кнопка A в шаблоне A должна изменить цвет.Обработка событий между разными шаблонами

Я использую Session get/set для изменения переменной, чтобы изменить цвет.

Вот мой код:

Session.set('monitor',0); 


    Template.B.events({  
     'click #buttonB' :function(event){ 
       Session.set('monitor',1); 
      } 
     return FlowRouter.go('/templateC'); 
    }) 

/*NOT WORKING */ 
    Template.A.helpers({ 
     randomlyNamed: function(){ 
      if (Session.get('monitor') == 1){ 
       document.getElementById("buttonA").style.background = "red"; 

      } 
     Session.set('monitor',0); 
    } 
    }) 

выпуска: Сеанс может быть установлен в 1, когда buttonB щелкнул. Проблема в том, что я не уверен, куда помещать код изменения цвета внутри шаблона A.

ответ

1

Вы можете установить стиль в помощнике и обратиться к нему в своем шаблоне.

HTML (в шаблоне):

<button id="buttonA" style="background-color: {{btnColor}}"> 

ЯШИ:

Template.A.helpers({ 
    btnColor(){ return (Session.get('monitor') == 1)? "red" : "black"; } 
}) 

здесь black является альтернативным цветом, но это может быть что угодно.

+0

Спасибо! Это именно то, что я искал. Один вопрос, как бы вы установили монитор на 0 после изменения цвета? – WoShiNiBaBa

+0

Если вы это сделали, цвет изменится. В этом шаблоне переменная Session напрямую управляет цветом. Если вы хотите изменить цвет только при нажатии кнопки, вы должны прямо установить цвет в исходном событии шаблона. –

Смежные вопросы