ng-model for surfaces and modifiers?

[pencilcheck]

It has always been this way, there is no way to handle custom html events on the surface because the scope is isolated (e.g. dragstart, etc) or do more advanced stuff with it like physics. I wonder if instead we can pass in surface reference via ng-model-ish directive as a workaround at the moment?

What I am envisioning is something like:

<fa-surface ng-model="surfaceInstance"></fa-surface>

var surfaceInstance = new Surface();
surfaceIntance.on('dragstart', function() {});

And for modifier, it would be nice especially for draggable, since I would like to attach certain event listeners or call specific function on it like 'activate', 'deactivate' but I can't because it is not exposed.

[zackbrown]

You may want to check out fa-render-node, which allows exactly this sort of behavior.

Create an arbitrary Famo.us component and expose it on your scope; bind it to your render tree using <fa-render-node fa-node="yourFamousComponent"></fa-render-node>

The other way to go about this is to create standard F/A components in your template and then get references to them using $famous.find. Once you have a reference to the component, you can do whatever you want to it, e.g. attach event handlers. For the use case you're describing with fa-draggable, this is the approach I would recommend.

var myDraggable = $famous.find('#my-draggable')[0].modifier; //note this has to happen after DOM compilation is complete just like with normal Angular, e.g. in a Directive postLink.
//now you have a reference to your Draggable; do whatever you want with it.

If there are use-cases that the ng-model approach would handle that neither of these do, let's keep the discussion going.

[pencilcheck]

I see. Didn't know about $famous.find() Thank.

I do feel like ng-model would really make sense when first time developing it, as you can just passin the reference of the object that the directive is going to create a lot of problems such as setting options for fa-app would be much easier. As opposed to setting id, to find it later (usually you have to do it inside a directive) or using fa-render-node when there is no need for it.

The example I gave above would be very useful to this new way of getting the hold of the modifier or render node reference instead of having a redundant directive that doesn't make any sense.

[jordanpapaleo]

Hi @pencilcheck

Thanks for being a part of this project and your suggestions. Unfortunately, this is not a task we are going to put additional energy into. If it is something that you feel strongly about I would encourage you to make the changes and submit a pull request for it.

Thanks again,

Jordan