Ember.js: إجراء الإدخال على = "التغيير" لا ينطلق

غريب:

حل بديل: http://emberjs.jsbin.com/yedigeyeda/1/edit؟html ، js، console، output

هذا مشابه لـ # 10305

هذا أمر مزعج حقًا في اختبارات القبول ، حيث لا يؤدي المساعد fillIn إلى تشغيل أي حدث "keyup" ، لذلك علي أن أفعل:

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

إذا أردت تشغيل الأحداث بشكل صحيح (حيث لا يمكنني استخدام حدث التغيير ، والذي من المحتمل أن يتم تشغيله بواسطة fillIn )

Fryie - هذا ليس له علاقة بالمشكلة المبلغ عنها هنا. لكن يبدو مشابهًا لـ https://github.com/emberjs/ember.js/pull/11016 .

معذرةً ، أردت فقط أن أشير إلى أن "keyup" ليس حلاً ممكنًا ، لذا فهو مرتبط بمعنى ما. :)

stefanpenner : اكتشفنا أنا و {{input}} لا يؤدي إلى تنفيذ إجراءات لأحداث معينة. إليك مثال أكثر تفصيلاً: http://ember-twiddle.com/0830f4ed9f15df59801e

(twiddle byJKGisMe)

في الواقع ، لا تعمل الكثير من الأحداث على مساعد الإدخال في الوقت الحالي ، بما في ذلك أي شيء متعلق بالماوس.

يا ، أنا أتتبع هذا. سنحاول ملء ما يحدث عندما لا يكون الهاتف المحمول.

هذه مشكلة خطيرة. لا يمكن أن يكون تعيين إجراءين أو أكثر لمساعد الإدخال. لا أصدق أن Ember 2.0.0 لا يزال لديه مثل هذه السمات مثل on-input = "" و on-change = "".
آمل أن يتم إصلاح هذا في أسرع وقت ممكن ...

لم أختبر _جميع_ الإجراءات ولكني استخدمت هذا للتو بنجاح:

{{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
insert-newline
escape-press  
focus-in      
focus-out     
key-press     
key-up        
key-down

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

يا ، أعتقد أن هذه المشكلة كانت تبلغ عن انحدار مع {{input action="foo" on="focus-in"}} (وهو الاسم المستعار {{input focus-in="foo"}} ) ، لكنني كنت مخطئًا (هذا يعمل بشكل صحيح مع أي من الأحداث المذكورة أعلاه).

يتعلق هذا تحديدًا باستخدام on="change" ، لكنني لست متأكدًا من أن هذا شيء نعتزم دعمه في الوقت الحالي.

حسنًا ، نعم ، لا بد لي من إضافة (mut model.value) إلى الإجراء عند التغيير لإصدار إدخال html.

الأمر الذي يقودني إلى التساؤل ... ما الفائدة من امتلاك {{input إذا كنت لا تستطيع حقًا استخدامه؟ يبدو أن <input معيب لأنه لا يمكنك بسهولة عمل ربط ثنائي الاتجاه مع hbs ولكن في نفس الوقت {{input غير قابل للاستخدام إلى حد ما بسبب قيود معالجة الحدث. ألن يكون من الأفضل ألا يكون لدينا {{input على الإطلاق حتى لا نخلط بين الأشياء؟

JKGisMe - هاه؟ كيف يكون {{input}} معيبًا؟ إنه يعمل ويستخدم من قبل الغالبية العظمى من تطبيقات Ember بدون حوادث ....

إذن في الجزء المرتبط أعلاه ... كيف ستفعل كل أولئك الموجودين بـ {{input ؟

في مشروع عملي ، انتهى بي الأمر عن غير قصد باستخدام طريقة html لجميع مربعات الإدخال قبل طرح هذا الأمر ، لكنني الآن أتساءل عما إذا كان الأمر كذلك قبل الميلاد ، لدي الكثير من الإجراءات المرتبطة بالأحداث التي عملت بهذه الطريقة ... : 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 لن يعمل.

أنا لا أقول أن هذا خطأ ؛ فقط غير متوقع. هذا جعلني أقفز إلى Slack وأسأل لماذا. لقد تم الترحيب بي من قبل الناس في حيرة من أمري.

أتساءل عما إذا كان هناك بالفعل تحديث لهذا

أنا جديد على Ember وقضيت آخر ساعة في تعقب هذا. لست متأكدًا مما إذا كان هذا بسبب أنني قمت بالتحويل مؤخرًا من Angular وأنا معتاد على توفر ng-change لي.

في الوقت الحالي ، ما زلت غير متأكد من الإجراءات أو الشعور بما تعنيه بالنسبة لي ، لذا لم أكن أعرف حتى ما الذي أبحث عنه.

بغض النظر ، أنا أعشق هذا الإطار. قادمًا من Angular ، يبدو كل شيء هنا مدروسًا جيدًا وأكثر اتساقًا.

تحرير: لا توجد إجراءات مطلوبة من هذه الوظيفة. كنت فقط أعطي ردود الفعل.

rwjblue @ morganick لقد

| حالة الاستخدام | {{input}} مقابل <input> |
| --- | --- |
| لاحظ القيم على المدخلات | {{input}} أو <input> |
| مربعات اختيار مع الإجراءات | <input {{action="actionName" on="change"}} (للاحتفاظ بحدث النقر بتحديث خاصية _checked_ الخاصة بمربع الاختيار ؛ لاحظ أن المراقب الموجود في _checked_ لا ينشط وأن خاصية مربع الاختيار _checked_ لا يمكن الوصول إليها (*) ؛ لاحظ أيضًا أن الربط click بهذه الطريقة يكسر سلوك تبديل مربع الاختيار النموذجي (!))؛ |
| أنواع المدخلات الأخرى | {{input}} إذا كان الحدث مدعومًا من Ember.TextSupport وإلا <input> |

أعتقد أيضًا أنه يجب علينا تغيير قسم الإجراءات ومربعات الاختيار هنا .

* ... 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 هنا: https://ember-twiddle.com/؟openFiles=templates.application.hbs٪2C
"
لا يعمل هل يمكنك التحديث؟

راجع للشغل ، فقط أعطي الحل لمن يأتي إلى هنا.

    <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

EricSchankFryieJKGisMeMarkMTSillyButtabepetrillodavidsteinbergergreyhwndzjcfinnerup @ jfuqua390ldonglocks هذا لا تزال قضية، ربما ينبغي لنا أن إغلاق أو إنشاء الاستنساخ الجديد هذا، ما رأيك؟

هناك العديد من الطرق لإنشاء حدث تغيير عملي في الختام

jcfinnerup أي أفكار حول كيفية اختبار هذا؟ كيف يمكنك إنشاء حدث الإدخال (مع مساعد مثل triggerEvent)؟