How do you call a Meteor template helper from the console or other JS code?

∥☆過路亽.° 提交于 2019-12-17 19:47:00

问题


I've defined a template helper in Meteor, say

Template.postsList.helpers({
  filteredPosts: function getPosts() {
    return Posts.find(...);
  }
});

How can I debug that template helper from the console, and how can I reuse it from other code in the app?


回答1:


  1. Wanting to call the helper from elsewhere in the app suggests that you should factor it out in a function.

  2. To quickly debug the helper, evaluate this in the client console:

    Template.postsList.__helpers.get('filteredPosts')(...parameters);
    
  3. There is a package that might help with debugging templates and template helpers: prasad19sara:client-debugger.




回答2:


It does not formally answer the question but I would like to share a simple technique, which virtually solves most of the problems you described.

Let's say we have a group of helpers, which we want to be able to access from different parts of your application both from templates and directly from our javascript code. To achieve that, I would have a global Helpers object, to which I could attach as many function as I want, e.g.

Helpers.routeIs = function (name) {
  var current = Router.current();
  return current && current.route && current.route.getName() === name;
};

Helpers.year = function () {
  return moment().year();
};

This makes them easily accessible throughout the code and pretty easy to test as well. But I also want to use them in my Spacebars templates, right?

A simple idea is to create a single global helper that would return the Helpers object itself.

Template.registerHelper('$', function () {
  return Helpers;
});

The nice thing about this is that it will enforce me to prefix each reference to my "global helper" with $, i.e. {{$.year}} or {{$.routeIs 'home'}}, which makes the code a lot more readable.

Unfortunately, there's a small problem with that solution. Consider the following example:

Helpers.fullName = function () {
  return this.firstName + ' ' + this.lastName;
};

The problem is that if my helper is about to access the current context through this, it will get the Helpers object itself rather than the data context, so the {{$.fullName}} will never work properly. But of course, there's a workaround for that:

Template.registerHelper('$', function () {
  return new Proxy(this);
});

function Proxy (context) {
  this.context = context;
}

// put this in a place when you're quite sure
// all the helpers are already defined

_.each(Helpers, function (helper, name) {
  Proxy.prototype[name] = function () {
    return helper.apply(this.context, arguments);
  };
});

EDIT

I've added a reference implementation here:

https://github.com/anticoders/meteor-helpers



来源:https://stackoverflow.com/questions/32042886/how-do-you-call-a-meteor-template-helper-from-the-console-or-other-js-code

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!