Giriş ve çıkışlar, Angular 2'nin stil kılavuzunun adlandırma kurallarına uymak için onlarla nasıl çalışılır? Ben daha iyi bilmeden önce

Question

benim yönergesi böyle tanımlamış olduğunuz için kullanılan: o zaman

... 
inputs: [ 
    'onOutside' 
] 
... 

export class ClickOutsideDirective { 
    @Output() onOutside: EventEmitter<any> = new EventEmitter(); 
} 

Ama Stil Kılavuzu okumak ve bunu Açısal 2 beri on ile çıkışlarını önek gerektiğini söyledi on- sözdizimi destekleri şablonlar. Eğer on kullanmasına izin verilmez ise, Zor Output adından @Input adını ayırmak için buluyorum Ancak

@Input() outsideClick: any; 
@Output() outsideClick: EventEmitter<any> = new EventEmitter(); 

:

Yani böyle bir şeyle değiştirmek çalışıyorum önek.

@Input ve @Output'un her ikisini de aynı şekilde adlandırabilirsiniz, ancak hem dışa aktarılan sınıf içinde hem de bildiriyorsa, bu bir hata atılacağından artık çalışmaz. Ben outside için @Input ve outsideClick için @Output isim ise ikisi de aynı şey olduğundan

, gerçekten mantıklı değil. outside, outsideClick numaralı telefonu çağırırken yürütmek istediğim işlevdir.

Ayrıca, outside artık aynı şeyin adı değil veya bir şey özlüyor muyum?

@Input ve @Output değişkenlerini adlandırmada nasıl yaklaşmalıyım? Böylece ilk örnekte olduğu gibi çalışır ve çok anlamlı olur?

DÜZENLEME:

Kullanım örneği:

<div clickOutside [exceptions]="['.toggler']" (outside)="doSomethingOnOutsideClick()"></div> 

Answer 1

Kesinlikle on kullanmayın. JavaScript olaylarında da on ile başlamayın. Sadece olay işleyicileri yapar. JS'de onClick etkinliği yok. Olay adı click şeklindedir ve onClick'a bir işlev atarsanız, click olayı alındığında bu işlev çağrılır.

birlikte ait giriş ve çıkışlar onları

@Input() name:any; 
@Output() nameChange: EventEmitter<any> = new EventEmitter();; 

adı varsa Bu @Input() ve @Output() (tercih edilen kullanımı durumunda Angular2 kısa elle

[(name)]="someProp" 

"iki yönlü bağlayıcı" izin verir şekilde) inputs: [] ve outputs: []'a ihtiyacınız yoktur. Bunlar aynı şeyi yapmanın iki yolu ve her ikisini birden kullanırsanız gereksizdir.

Ne yapabilirsin tarayıcı adlandırma şeması

(nameChange)="onNameChange($event)" 

nameChange olayı alındığında bir olay işleyicisi onNameChange çağrılacak sahip olmaktır eşleştirmek için.

olay veya Change

(loggedIn)="onLoggedIn($event)