이벤트 객체를 매개 변수로 전달하는 방법 (컨트롤러의 작업에 대한 핸들 막대 템플릿에서)

Question

나는 엠버 (ember)를 처음 사용하므로 도움을 주셔서 감사합니다. 내 컨트롤러 내 행동에

{{input type="text" class="form-control" **focus-out= (action "ccFocusLost" event**) }} 

: 내 핸들 템플릿에서 (아래 굵게 표시된 텍스트를 참조) 초점 아웃 이벤트를 전달하려는 그러나

ccFocusLost : function(**event**) { 
     alert(event.relatedTarget.tagName); 
    }, 

, 내가 정의되지 않은 얻을 때 위와 같이하십시오. 주요 요소가 손실 된 후에 어떤 요소가 포커스를 받을지 알아 내기 위해 포커스 - 아웃 이벤트를 얻는 방법이 필요합니다.

미리 감사드립니다.

Answer 1

컨트롤러에 focusOut 작업 처리기를 정의하고 해당 이벤트가 input 필드의 "form-control"클래스에서 왔는지 확인할 수 있습니다. 예 :

focusOut(event) { 
    /* if event did not come from desired input field, return here */ 
    /* else call the action as desired to process the focusOut event */ 
} 

또는 입력란을 감싸는 구성 요소를 만들어 컨트롤러가 아닌 구성 요소 수준에서 focusOut 이벤트를 정의 할 수 있습니다. 이벤트가 입력 필드에서 왔는지 확인해야 할 필요가 없습니다. 엠버의 이벤트 처리에 대한 자세한 내용

, 여기에 자세히 제공하는 가이드의 섹션 : Handling Events

Answer 2

두 가지를

1. 당신이 작업이 자동으로 의지 대신 focus-out의 focusOut를 사용하는 경우 jQuery 이벤트를 인수로 포함 시키십시오. 템플릿에서 지정할 필요가 없습니다.

{{input focusOut=(action "ccFocusLost") }}

코드에서
1. , 이벤트가 이미 행동에 전달되고, 그것은 JQuery와 이벤트의 relatedTarget의 속성이 null 단지입니다. 이것은 jQuery/Javascript 이벤트입니다. unrelated to Ember. here을 참조하십시오.

이 더 많은 정보를 relatedTargets에 거기, 그러나 단지 그것은 신중해야 document.activeElement

Answer 3

사용하는 것이 더 좋을 것 같다,하지만 여기에 솔루션입니다.

템플릿 (이벤트 인수를 가질 필요가 없습니다) : 나는 다음과 같은 코드가

{{input type="text" class="form-control" **focus-out= (action "ccFocusLost") }}

컨트롤러 : 그래서 핸들이 액세스 할 수있는 것 같다

 ccFocusLost : function() {  
      var targetId= event.relatedTarget.id;  
      alert(targetId); 
     }, 

그 사건을 논쟁으로 보낼 필요가 없다. 이 경우 id = button1 인 버튼을 누르면 경고에 button1이 표시됩니다.