Ember 2'deki belirli giriş öğelerine odaklanma 2

Question

Ember 2'yi öğreniyorum ve basit bir satır içi düzenleyici yazmayı deniyorum. Benim problemim giriş elemanına otomatik odaklanıyor. Kontrolör varlık ile

{{#if isEditing}} 
    {{input type="text" placeholder="Line item" autofocus="autofocus" value=value class="form-control" focus-out="save"}} 
{{/if}} 
{{#unless isEditing}} 
    <a href="#" {{action "toggleEditor"}}>{{value}}</a> 
{{/unless}} 

:

import Ember from 'ember'; 

export default Ember.Component.extend({ 
    actions: { 
     toggleEditor: function() { 
      this.set('isEditing', !this.get('isEditing')); 
     }, 
     save: function() { 
      var object = this.get('object'); 
      var property = this.get('property'); 
      object.set(property, this.get('value')); 
      var promise = object.save(); 
      promise.finally(() => { 
       this.send('toggleEditor'); 
      }); 
     } 
    } 
}); 

true isEditing parametresini ayarlarken autofocus="autofocus" eser kullanılması aşağıdaki gibi bileşenin şablondur. Ancak, bağlantı elemanı görünür olduğunda ve kullanıcı bağlantıya tıkladığında, odak yeni görünür girdi öğesine aktarılmaz. Benim sorum şu: Giriş öğesine odaklanmanın en iyi yolu nedir? İçerisinde toggleEditor, giriş elemanına ID ile nasıl erişebilirim ve Ember'i kullanarak nasıl odaklayabilirim?

Answer 1

Özellikleri değiştirmenin daha iyi bir yolu var. Ayrıca/else seçeneğini de kullanmayı düşünebilirsiniz.

{{#if isEditing}} 
    {{input type="text" placeholder="Line item" class="my-input"}} 
{{else}} 
    <a href="#" {{action "toggleEditor"}}>{{value}}</a> 
{{/if}} 

Çalıştığım şekilde böyle bir eylem yazmaktı.

toggleIsEditing: function() { 
     this.toggleProperty('isEditing'); 

     if(this.get('isEditing')) { 
      Ember.run.scheduleOnce('afterRender', this, function() { 
       $('.my-input').focus(); 
      }); 
     } 
}, 

Garip şeyler tho.