Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Know if an @output event is binded in the parent component

Tags:

angular

I have an @Output labelClicked = new EventEmitter(); and I want to know if this event has been binded in the parent component (with <myComponent (labelClicked)="open($event)"></myComponent>) so I can style my component with a cursor: pointer.

Is this possible?

like image 655
Julien Avatar asked Mar 10 '17 14:03

Julien


People also ask

How do you access the child component property in the parent component?

We can get child component values in the parent component by creating a reference to the child component using the @ref directive in the Parent component. Using the reference instance, you can access the child component values in the parent.

Which decorator lets a child component expose an event to a parent component?

The @Input() decorator in a child component or directive signifies that the property can receive its value from its parent component.

What is the difference between @input and @output in Angular?

Input is used to receive data in whereas Output is used to send data out. Output sends data out by exposing event producers, usually EventEmitter objects. by the way, I will produce and send data out via the onChange property.


1 Answers

Solution :

<span class="label" [class.clickable]="labelClicked.observers.length > 0">{{label}}</span>

( css : .clickable { cursor: pointer; } )

Explaination :

As per my understand you want to detect if the event handler attached with the component or not. if it's attached you want to add some class else no need to attach the class.

i just did the quick check actually angular @output variable hold the info about how many handler attached with the event

enter image description here

enter image description here

in that above image i have attached handler with submit event and close event dont have any handler attached. so you can check this array and assign class using render

like image 119
Ravin Singh D Avatar answered Sep 25 '22 23:09

Ravin Singh D