Ember.js: 입력 작업 on = "change"가 실행되지 않습니다.

이상한:

해결 방법 : http://emberjs.jsbin.com/yedigeyeda/1/edit?html , js, console, output

이것은 # 10305와 유사합니다.

이것은 fillIn 도우미가 "키업"이벤트를 트리거하지 않는 수락 테스트에서 정말 성가 시므로 다음을 수행해야합니다.

fillIn('#my-input', 'some-val');
find('#my-input').trigger('keyup');

이벤트가 제대로 실행되기를 원하는 경우 ( fillIn 에 의해 트리거 될 수있는 변경 이벤트를 사용할 수 없기 때문에).

@Fryie- 여기에보고 된 문제와 관련이 없습니다. 하지만 https://github.com/emberjs/ember.js/pull/11016 과 유사합니다.

죄송합니다. '키업'이 실행 가능한 해결 방법이 아니라는 점을 지적하고 싶었습니다. 따라서 어떤 의미에서는 관련이 있습니다. :)

@stefanpenner : @JKGisMe 와 저는 최근에 {{input}} 도우미를 사용하면 지정된 이벤트에 대한 작업이 트리거되지 않는다는 것을 발견했습니다. 다음은 더 자세한 예입니다. http://ember-twiddle.com/0830f4ed9f15df59801e

(@JKGisMe의 회전)

실제로 마우스와 관련된 모든 이벤트를 포함하여 현재 많은 이벤트가 입력 도우미에서 작동하지 않습니다.

Ya, 나는 이것을 추적하고있다. 모바일이 아닐 때 일어나는 일을 채우려 고합니다.

이것은 심각한 문제입니다. 두 개 이상의 작업을 설정하는 것은 입력 도우미를위한 것이 아닙니다. Ember 2.0.0에 on-input = ""및 on-change = ""와 같은 속성이 아직 없다는 것을 믿을 수 없습니다.
이것이 최대한 빨리 해결되기를 바랍니다.

_all_ 작업을 테스트하지는 않았지만 성공적으로 사용했습니다.

{{input 
    value=value 
    autoresize=true 
    focus-in="inputFocusIn" 
    focus-out="inputFocusOut" 
    enter="removeFocus" 
}}

구식 HTML 버전과 hbs 작업을 사용하여이를 달성 할 수도 있습니다.

<input 
    value={{someValue}} 
    onblur={{action checkForValid value="target.value"}}
    oninput={{action validate value="target.value"}}
/>

현재 다음을 지원합니다.

insert-newline
escape-press  
focus-in      
focus-out     
key-press     
key-up        
key-down

http://emberjs.com/api/classes/Ember.TextSupport.html

Ya, 나는이 문제가 {{input action="foo" on="focus-in"}} ( {{input focus-in="foo"}} 별칭으로 지정됨)로 회귀를보고한다고 생각했지만 잘못되었습니다 (위에 나열된 모든 이벤트에서 제대로 작동합니다).

이것은 특히 on="change" 에 관한 것이지만 이것이 현재 우리가 지원할 의도인지 확실하지 않습니다.

예, html 입력 버전의 변경시 작업에 (mut model.value) 을 추가해야합니다.

그래서 제가 궁금해하게되는데 ... {{input 정말로 사용할 수 없다면 무엇이 중요한가요? <input 는 hbs로 양방향 바인딩을 쉽게 할 수 없기 때문에 결함이있는 것처럼 느껴지지만 동시에 {{input 는 이벤트 처리 제한으로 인해 다소 사용할 수 없습니다. 혼란스럽지 않도록 {{input 를 전혀 사용하지 않는 것이 더 낫지 않을까요?

@JKGisMe- 응? {{input}} 결함은 무엇입니까? 그것은 작동하고 사고없이 대부분의 Ember 응용 프로그램에서 사용됩니다 ....

그래서 위에 링크 된 twiddle에서 ... {{input 모든 것을 어떻게 하시겠습니까?

내 작업 프로젝트에서 실수로 모든 입력 상자에 대해 html 방식을 사용하게되었지만 이제는 이것이 bc인지 궁금합니다. 이런 식으로 작동하는 이벤트에 많은 작업이 첨부되어 있습니다 .... : P는 개발자가 실제로 기억하지 못하는 것이 너무 나쁩니다.

@rwjblue {{input}} 도우미를 사용할 때 내 기대는 값 및 바인딩 이벤트에 대해 양방향 바인딩을 수행하는 동안 HTML 입력을 만들기위한 구문 적 설탕이라는 것이 었습니다. {{input}} 는 click 또는 change 를 사용하여 작업에 직접 바인딩 할 수 없기 때문에 이벤트에 대한 일대일 바인딩이 아닙니다. 당신은 문서화 된 이벤트 중 하나를 사용해야합니다.

이 가이드를 읽는 것은 입력에 사용할 수없는 것에 대한 언급이 없기 때문에 가장 오해의 소지가 있습니다.

http://guides.emberjs.com/v2.0.0/templates/input-helpers/

특히, 액션 섹션은 모든 이벤트에 대한 링크를 제공하고 대 시화하도록 알려줍니다. 파헤쳐 서이 페이지에 도달 할 때까지는 아닙니다.

http://emberjs.com/api/classes/Ember.Templates.helpers.html#method_input

다음 문장으로 시작 : "도우미는 일부 사용자 이벤트가 작업을 보낼 수 있도록 허용합니다."

당신은 당신이 미쳐 가지 않고 click 가 작동하지 않을 것이라는 것을 알고 있습니다.

나는 그것이 틀렸다고 말하는 것이 아닙니다. 예상치 못한 일입니다. 이로 인해 슬랙으로 뛰어 들어 그 이유를 묻게되었습니다. 나처럼 당황한 사람들과 인사를 나눴다.

이것에 대한 업데이트가 이미 있는지 궁금합니다

저는 Ember를 처음 접했고 지난 1 시간 동안 이것을 추적했습니다. 이것이 Angular에서 최근에 변환했고 ng-change 사용할 수있는 데 익숙하기 때문인지 확실하지 않습니다.

지금은 여전히 ​​어떤 행동이 뭔지 잘 모르거나 그게 나에게 어떤 의미인지 느낌이있어서 무엇을 검색해야할지조차 몰랐습니다.

어쨌든 저는이 프레임 워크를 좋아합니다. Angular에서 온, 여기에있는 모든 것은 잘 생각되고 훨씬 더 일관된 느낌입니다.

편집 :이 게시물에서 필요한 작업이 없습니다. 나는 단지 피드백을주고 있었다.

@rwjblue @morganick 나도이 _miss-understanding_에 물렸다. 구성 요소의 입력에 대해 언제 어떤 형식을 사용해야하는지에 대한 단순화 된 지침이기는하지만 다음 내용이 정확합니까?

| 사용 사례 | {{input}} 대 <input> |
| --- | --- |
| 입력 값 관찰 | {{input}} 또는 <input> |
| 작업이있는 확인란 | <input {{action="actionName" on="change"}} (확인란의 _checked_ 속성을 업데이트하는 클릭 이벤트 유지; _checked_의 관찰자가 실행되지 않으며 확인란의 _checked_ 속성에 액세스 할 수 없음 (*); 또한 바인딩 click 이런 식으로
| 기타 입력 유형 | Ember.TextSupport가 이벤트를 지원하는 경우 {{input}} 그렇지 않으면 <input> |

또한 여기 에서 Actions & Checkboxes 섹션을 변경해야한다고 생각합니다.

액션 핸들러 및 액세스를 등록 * ... IMO 수있는 유일한 방법은 체크 박스의 _checked_ 값은 신뢰성 형태로 사용하는 것입니다 onClick={{action "actionName"}} 체크 ev.target.checked 액션 핸들러있다. 나는 또한 onClick={{action "actionName"}} 와 {{action "actionName" on='click'}} 다르게 동작한다는 것을 알아 챘습니다. 첫 번째는 이벤트 리스너를 통과하고 두 번째는 그렇게하지 않습니다. 의도 된 건가요?

나는 이것에 문제가 있었고 입력 값이 변경되면 저장 버튼을 변경해야했습니다. 양식 내부에 입력을 설정하고 양식 자체에 "변경"작업을 설정하면 양식 내의 입력 중 하나가 변경 될 때마다 작업이 실행된다는 것을 발견했습니다.

여기 Twiddle : https://ember-twiddle.com/?openFiles=templates.application.hbs%2C

여기에서 이벤트 이름을 참조하십시오 : http://emberjs.com/api/classes/Ember.View.html#toc_event -names

이것이 문제가 아니라면 무시하십시오 😄.

@ jfuqua390 당신의 twiddle 링크
"
여기 Twiddle : https://ember-twiddle.com/?openFiles=templates.application.hbs%2C
"
작동하지 않습니다. 업데이트 할 수 있습니까?

BTW, 여기 오는 사람에게 내 솔루션을 제공합니다.

    <input
      multiple="true"
      onchange={{action "upload"}}
      accept="image/png,image/jpeg,application/pdf"
      type="file"
    />

    actions: {
      upload: function(event) {
        console.log('upload');
      }
    }

@ldong 나는 당신의 작업을 시도했고 (이전 버전의 ember에서) 다음과 같은 오류를 받았습니다.

Uncaught ReferenceError: Invalid left-hand side in assignment

내가 뭔가를 놓치고 있는지 확실하지 않습니까?

여전히 이것으로 어려움을 겪는 사람에게는 이것이 잘 작동하는 것 같습니다.

{{input value=value input=(action "valChange")}}

Stackoverflow에서 복사

@EricSchank @Fryie @JKGisMe @MarkMT @SillyButt @abepetrillo @davidsteinberger @greyhwndz @jcfinnerup @ jfuqua390 @ldong @locks 이것은 여전히 ​​문제입니까?

지금은 작업중인 변경 이벤트를 만드는 방법이 많이 있습니다.

@jcfinnerup 이것을 테스트하는 방법에 대한 아이디어가 있습니까? (triggerEvent와 같은 도우미를 사용하여) 입력 이벤트를 어떻게 생성합니까?