2016-05-03 18 views
7

Veli şablonu:nasıl kabarcık kadar angular2 özel etkinliği için

<ul> 
    <tree-item [model]="tree" (addChild)="addChild($event)"></tree-item> 
</ul> 

Ağaç öğesi şablonu:

Yukarıdaki Örneğin
<li> 
    <div>{{model.name}} 
    <span [hidden]="!isFolder" (click)="addChild.emit(model)">Add Child</span> 
    </div> 
    <ul *ngFor="let m of model.children"> 
    <tree-item [model]="m"></tree-item> 
    </ul> 
</li> 

, ebeveyn yalnızca kök ağaç öğeden addChild olayı alır (anında çocuk) . Herhangi bir ağaç öğesinden addChild olayını balonlamak mümkün mü? Açısal 2.0.0-rc.0 kullanıyorum.

cevap

11

EventEmitter olayları köpürmeyi desteklemez.

element.dispatchEvent(), kabarcıklar açan bir DOM olayını tetiklemek veya ileti yolu gibi paylaşılan bir hizmeti kullanmak için kullanabilirsiniz.

+0

https://angular.io/docs/ts/latest/cookbook/component-communication.html bir JavaScript CustomEvent nesnesi kullanılabilir mi Ayrıca bkz? Bunun yanlısı var mı? Açısal dokümantasyonda gerçekten kapalı değildir. Belki de doğrudan DOM'a erişmeye karşı tavsiye ettikleri için – Ryan

+0

'element.dispatchEvent() 'ifadesi budur. Açısal, DOM olayları yerine paylaşılan bir hizmet kullanmayı önerir. Bir DOM olayı, tüm uygulamanın çalışması için değişiklik saptamasına neden olabilirken, gözlenebilir bir hizmet yalnızca gözlemlenebilirliğe abone olan bileşen için değişiklik saptamasına neden olur. –

+0

@ GünterZöchbauer, belirli bir sınıf/seçicinin çapalarına sağ tıklamanın özel bir bağlam menüsü göstermesi gereken bir uygulama olduğunu varsayalım. jQuery'de '$ ('body') gibi bir öğeye sahip oluruz ('contextmenu', 'a.context', myFunction)' Olayı bir etiket yerine gövdeye bağlamayı tercih ederim. Angular2'de bu yaklaşımın mümkün olmadığını söylüyorsun? – igasparetto

İlgili konular