Angular 2 - Send "this" as input to child component

[Jason Connell]

Good evening,

Is there a way to send the current component as a parameter to the child component?

I think this plunker will explain pretty accurately what I'm trying to do:  http://plnkr.co/edit/5xToh9aIQFtHwh1P2BRn?p=preview

<edit-toggle [editable]="this" ... ></edit-toggle>

I've worked around it by having a .asEditable() method on the abstract Editable class, which just returns this.  I'm fine with this approach unless there's a way to more directly pass "this". It will help with some code reuse, but I'm also not in love with this approach, so if there's a better way (maybe construct a new, concrete Editable object in my component. But really what I'm signifying is that the component itself is editable). More discussion around this and the ideas behind it is also welcome, the app is young, paths can be nudged :)

Thanks for your help!

Jason

[Günter Zöchbauer]

You can't use `this` in binding expressions but you can create a getter or function in your component that returns `this`. You can then use this getter or function in your binding expression.

[Sander Elias]

Hi Jason,

If what you want to catch with 'this' in your template is the current element, this is the most direct way to do it:

<edit-toggle #e [editable]="e"></edit-toggle>

However I think it's easier to inject the elementRef in your component.

Regards

Sander

[Jason Connell]

Thank you for your input! I have this code in place as you imagined. I'm ok with it, open to further discussion as well, on best practices, etc.

[Jason Connell]

Thank you. I will play with that!

Jason