Ember.js - 컨트롤러와보기 간의 통신

Question

저는 Ember를 배우는 초기 단계에 있으며, 수수께끼 같은 것을 겪었습니다. 두 컨트롤러 사이에서 통신하고 해당보기도 업데이트하려고합니다.

단순화 된 버전에서는 하나의 컨트롤러에서 이벤트를 발생시키는 버튼을 클릭하여 다른 컨트롤러에서 타이머를 시작합니다. 이 작동하지만 값이 변경 될 때 타이머보기를 업데이트 중인지 않습니다. 여기

내가 가진 무엇 :

var App = Ember.Application.create(); 

App.Route = Ember.Route.extend({ 
    events: { 
     startTimer: function(data) { 
      this.get('container').lookup('controller:Timer').start(); 
     } 
    } 
}); 

App.ApplicationController = Ember.Controller.extend({ 

    actionWord: 'Start', 

    toggleTimer: function() { 
     var timer = this.get('container').lookup('controller:Timer'); 

     if(timer.get('running')) { 
      timer.stop(); 
     } else { 
      timer.start(); 
      this.set('actionWord', 'Stop'); 
     } 
    } 
}); 

App.TimerController = Ember.Controller.extend({ 

    time: 0, 
    running: false, 
    timer: null, 

    start: function() { 
     var self = this; 

     this.set('running', true); 

     this.timer = window.setInterval(function() { 
      self.set('time', self.get('time') + 1); 
      console.log(self.get('time')); 
     }, 1000); 
    }, 

    stop: function() { 
     window.clearInterval(this.timer); 
     this.set('running', false); 
     this.set('time', 0); 
    } 

}); 

을하고 템플릿 :

<script type="text/x-handlebars"> 
    {{ render "timer" }} 

    <button {{action toggleTimer }} >{{ actionWord }} timer</button> 
</script> 

<script type="text/x-handlebars" data-template-name="timer"> 
    {{ time }} 
</script> 

http://jsfiddle.net/mAqYR/1/

UPDATE :

언급하는 것을 잊었다 당신은 콘솔을 열 경우 시간이 TimeController 함수 내부에서 업데이트되는 것을 볼 수 있습니다. 그것은 단지보기에 나타나지 않습니다.

또한 TimerController에서 시작 동작을 호출하면보기가 올바르게 업데이트됩니다.

감사합니다.

Answer 1

Ember의 오래된 버전을 사용하고 있습니다. 나는 Ember rc3에 당신의 바이올린을 업데이트했습니다. 또한 container.lookup의 인스턴스를 올바른 방법으로 바꿨습니다. container은 꽤 많은 개인적인 개체입니다. 좋은 작품

http://jsfiddle.net/3bGN4/255/

window.App = Ember.Application.create(); 

App.Route = Ember.Route.extend({ 
    events: { 
     startTimer: function(data) { 
      this.controllerFor('timer').start(); 
     } 
    } 
}); 

App.ApplicationController = Ember.Controller.extend({ 
    actionWord: 'Start', 
    needs: ["timer"], 
    toggleTimer: function() { 
     var timer = this.get('controllers.timer'); 
     if(timer.get('running')) { 
      timer.stop(); 
     } else { 
      timer.start(); 
      this.set('actionWord', 'Stop'); 
     } 
    } 
}); 

App.TimerController = Ember.Controller.extend({ 
    time: 0, 
    running: false, 
    timer: null, 

    start: function() { 
     var self = this; 
     this.set('running', true); 
     this.timer = window.setInterval(function() { 
      self.set('time', self.get('time') + 1); 
      console.log(self.get('time')); 
     }, 1000); 
    }, 
    stop: function() { 
     window.clearInterval(this.timer); 
     this.set('running', false); 
     this.set('time', 0); 
    } 
});