Edit in place Meteor view without using a session

Question

I want to include a template (or use an assistant, I don't care) that you can click to edit in place. This view MUST be reused and therefore cannot rely on a variable Sessionor any other variables that are not contained in the view instance.

In display mode, it will look like this:

<div class="editable">{{content}}</div>

which will be changed to edit mode when you click on it, which will look like this:

<input type="text" value="{{content}}" />

and you can return to the display mode (saving it accordingly) by pressing the enter button or by pressing the button.

The meteor does not seem to make this incredibly easy since my first attempts with html:

<template name="editable">
    {{#if editing}}
        <input type="text" value={{this}} />
    {{else}}
        <div class="edit-thing">{{this}}</div>
    {{/if}}
</template>

// In the appropriate display template.
{{> editable stuff}}

and js:

Template.user.stuff = "yo yo yo";

Template.editable.events({
    'click .edit-thing': function(e) {
        this.isEditing = true;
    }
});

Template.editable.helpers({
    editing: function() {
        return !!this.isEditing;
    }
});

, Deps . ( , this.isEditing editing.)

, ! !

Answer 1

Deps, depend, changed? js :

Template.editable.created = function() {
    this.data.isEditing = false;
    this.data.isEditingDep = new Deps.Dependency();
};

Template.editable.events({

    '... whatever to start edit mode ...': function(e, t) {
        t.data.isEditing = true;
        t.data.isEditingDep.changed();
    },

    '... whatever to close edit mode ...': function(e, t) {
        t.data.isEditing = false;
        t.data.isEditingDep.changed();
    },
}); 

Template.editable.editing = function() {
    this.isEditingDep.depend();
    return this.isEditing;
};