@HostListener ve Renderer.listen arasında hangisi daha iyi?

Question

http://rectangleworld.com/demos/SimpleDragging/SimpleDragging'a benzer basit bir tuval sürükle bırak uygulaması yapıyorum. Fareevent dinleyicileri için @Hostlistener kullanıyorum çünkü benim için daha basit bir sözdizimi var ve çalışıyor. Renderer.listen ile bunu başarmanın başka bir yolu var. Ama bunu hostlistener üzerinden kullanmaya karar veremem. @HostListener ve Renderer.listen arasında hangisinin daha iyi olduğunu anlatabilir ve söyleyebilir misiniz?

Answer 1

Cevabım en iyisi olmayabilir ama elimde ne var. o Renderer.listen() gelince

Renderer.listen()

Eğer algılamak istiyorum Element ardından Event dinlemek (click, keydown, keyup vb geçmesi gerekiyor) ve son olarak,numaralı telefondan numaralı telefonu arayın.fonksiyonu (*):

listen(renderElement: any, name: string, callback: Function): Function { 
    return this._rootRenderer.eventManager.addEventListener(renderElement, name, decoratePreventDefault(callback)); 
} 

Yani sorun artık sadece belirtilerek olacağını Element (kolay) ama insanlar genellikle güvenlik riskiAngular Documentation göre bugüne kullanmadan önce mutlaka bir elementRef.nativeElement kullanın !. Başka bir problem (gerçekten olmayacak), Renderer sınıfının deneysel (Check its Documentation), RC'de çalışmak için kullanılan setText() ile bir problemle karşı karşıya olduğudur, ancak şimdi değil .. bu yüzden Renderer işlevlerini kullanmadan önce test edin. aaaaaaand bittiğinde, olayı el ile çözmeniz gerekir !, Check this answer for more.

Ancak, temel amacı herhangi bir ortamda (Web, Düğüm, Mobiles, .et) öğelerin bir kod tabanı ile oluşturulmasından dolayı Renderer durumundan haberdar olurdum. gelecek.

@HostListener()

HostListener büyük dekoratör ve yalnızca olay ve geri arama işlevine iletilen (bunun altında işlevine) değerini ayarlamak gerekir nasıl Angular2 typescript ile çalışır harika gösteriyor ve genellikle insanlar sadece [$event] geçer, böylece işlevin içinde doğrulamalar üzerinde daha fazla kontrole sahip olabilirsiniz ve 'u ayarlamaya gerek yoktur.dinler çünkü olaylara bir delegation yapıyor ve DOM ve uygulamanız güvende olacak. Ayrıca, olayları çözmenize de gerek yok, Angular bunu sizin için yapacak.

Check this article for a working example

cevabım yardım, hala çok bazı şeyler değişebilir gelişmektedir Açısal hatırlamak Umut.

Referanslar:

*: Hacking Angular2: Binding Multiple DOM Events by Sean T. Larkin