简体   繁体   中英

How to create action helper for my Handlebar's template?

I have a template

    <div class="message">
        <div class="quote"><div class="tail"></div>{{prompt}}</div>
        <textarea name="message" placeholder="Your question"></textarea>
        <button name="ask" value="ask">Ask</button>
    </div>

I want to do helper like that <button name="ask" value="ask" {{action askAction on="click"}}>Ask</button>

And this helper create jQuery event handler like:

jQuery("button[name=ask]").click(function(){
    App.askAction();
})

I want to make abstraction on my html and I don't want to use anything except jQuery and Handlebars.

I found this http://jsfiddle.net/ebryn/cCRck/

Ember.Handlebars.registerHelper('action', function(actionName, options) {
  var hash = options.hash || {},
      actionId = ++jQuery.uuid,
      eventName = options.hash.on || "click",
      // Do we need to worry about the specified target changing?
      target = options.hash.target ? Ember.getPath(options.hash.target) : this, 
      ret = [];

  var handler = registeredActions[actionId] = function(event) {
    target[actionName](event);
  };

  // FIXME: Use App's rootElement
  $(document.body).delegate('[data-ember-action=' + actionId + ']', eventName, handler);

  ret.push('data-ember-action="' + actionId + '"');
  return new Ember.Handlebars.SafeString(ret.join(' '));
});

and customized a little bit

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM