Handlebars: Dynamic Partial

You can use a subexpression as partial name. The partial name will be decided by the result of custom helper at run time.

This is a handlebars.js extension, mustache do not support this.

Samples

The return value of helper foo will be partial name

lightncandy

Used option: FLAG_ADVARNAME FLAG_RUNTIMEPARTIAL

Partials:
bar1Hello
bar2World
Data:
NULL
Template:
{{>(foo 1)}}, {{>(foo 2)}}
Result:
Hello, World

Check the code to know used helper codes

Source Code 
require('./vendor/autoload.php');
use LightnCandy\LightnCandy;
$template = "{{>(foo 1)}}, {{>(foo 2)}}";

$php = LightnCandy::compile($template, array(
  "flags" => LightnCandy::FLAG_ADVARNAME | LightnCandy::FLAG_RUNTIMEPARTIAL,
  "partials" => array(
    "bar1" => "Hello",
    "bar2" => "World"
  ),
  "helpers" => array(
    "foo" => function ($arg1) {
      return 'bar' . $arg1;
    }
  )
));
$render = LightnCandy::prepare($php);
$data = NULL;
echo $render($data);
handlebars.js
Partials:
bar1Hello
bar2World
Data:
null
Template:
{{>(foo 1)}}, {{>(foo 2)}}
Result:
Hello, World

Check the code to know used helper codes

Source Code 
var Handlebars = require('handlebars');
var template = '{{>(foo 1)}}, {{>(foo 2)}}';

Handlebars.registerHelper({
  'foo': function (arg1) {
    return 'bar' + arg1;
  }
});
var render = Handlebars.compile(template);
var data = null;
console.log(render(data, {
 partials: {
  "bar1": "Hello",
  "bar2": "World"
}}));

When partial name is not exist it will cause runtime error

lightncandy

Used option: FLAG_ADVARNAME FLAG_RUNTIMEPARTIAL

Partials:
bar1Hello
bar2World
Data:
NULL
Template:
{{>(foo)}}
Result:
Can not find partial named as 'bar_not_found' !!

Check the code to know used helper codes

Source Code 
require('./vendor/autoload.php');
use LightnCandy\LightnCandy;
$template = "{{>(foo)}}";

$php = LightnCandy::compile($template, array(
  "flags" => LightnCandy::FLAG_ADVARNAME | LightnCandy::FLAG_RUNTIMEPARTIAL,
  "partials" => array(
    "bar1" => "Hello",
    "bar2" => "World"
  ),
  "helpers" => array(
    "foo" => function () {
      return 'bar_not_found';
    }
  )
));
$render = LightnCandy::prepare($php);
$data = NULL;
echo $render($data);
handlebars.js
Partials:
bar1Hello
bar2World
Data:
null
Template:
{{>(foo)}}
Result:
The partial bar_not_found could not be found

Check the code to know used helper codes

Source Code 
var Handlebars = require('handlebars');
var template = '{{>(foo)}}';

Handlebars.registerHelper({
  'foo': function () {
    return 'bar_not_found';
  }
});
var render = Handlebars.compile(template);
var data = null;
console.log(render(data, {
 partials: {
  "bar1": "Hello",
  "bar2": "World"
}}));

You can use the lookup helper to return the template's name from an object

lightncandy

Used option: FLAG_ADVARNAME FLAG_RUNTIMEPARTIAL

Partials:
enHello {{name}}.
esHola {{name}}.
frBonjour {{name}}.
Data:
array(
  "foo" => array(
    array(
      "template" => "en",
      "name" => "alice"
    ),
    array(
      "template" => "es",
      "name" => "bob"
    ),
    array(
      "template" => "fr",
      "name" => "casey"
    )
  )
)
Template:
{{#each foo}}{{> (lookup . 'template')}}{{/each}}
Result:
Hello alice. Hola bob. Bonjour casey.
Source Code 
require('./vendor/autoload.php');
use LightnCandy\LightnCandy;
$template = "{{#each foo}}{{> (lookup . 'template')}}{{/each}}";

$php = LightnCandy::compile($template, array(
  "flags" => LightnCandy::FLAG_ADVARNAME | LightnCandy::FLAG_RUNTIMEPARTIAL,
  "partials" => array(
    "en" => "Hello {{name}}. ",
    "es" => "Hola {{name}}. ",
    "fr" => "Bonjour {{name}}."
  )
));
$render = LightnCandy::prepare($php);
$data = array(
  "foo" => array(
    array(
      "template" => "en",
      "name" => "alice"
    ),
    array(
      "template" => "es",
      "name" => "bob"
    ),
    array(
      "template" => "fr",
      "name" => "casey"
    )
  )
);
echo $render($data);
handlebars.js
Partials:
enHello {{name}}.
esHola {{name}}.
frBonjour {{name}}.
Data:
{
  "foo": [
    {
      "template": "en",
      "name": "alice"
    },
    {
      "template": "es",
      "name": "bob"
    },
    {
      "template": "fr",
      "name": "casey"
    }
  ]
}
Template:
{{#each foo}}{{> (lookup . 'template')}}{{/each}}
Result:
Hello alice. Hola bob. Bonjour casey.
Source Code 
var Handlebars = require('handlebars');
var template = '{{#each foo}}{{> (lookup . \'template\')}}{{/each}}';

var render = Handlebars.compile(template);
var data = {
  "foo": [
    {
      "template": "en",
      "name": "alice"
    },
    {
      "template": "es",
      "name": "bob"
    },
    {
      "template": "fr",
      "name": "casey"
    }
  ]
};
console.log(render(data, {
 partials: {
  "en": "Hello {{name}}. ",
  "es": "Hola {{name}}. ",
  "fr": "Bonjour {{name}}."
}}));

You can use dynamic partials to load templates from within a list of their names

lightncandy

Used option: FLAG_ADVARNAME FLAG_RUNTIMEPARTIAL

Partials:
aHello
bWorld
c!
Data:
array(
  "foo" => array(
    "a",
    "b",
    "c"
  )
)
Template:
{{#each foo}}{{> (bar .)}}{{/each}}
Result:
HelloWorld!

Check the code to know used helper codes

Source Code 
require('./vendor/autoload.php');
use LightnCandy\LightnCandy;
$template = "{{#each foo}}{{> (bar .)}}{{/each}}";

$php = LightnCandy::compile($template, array(
  "flags" => LightnCandy::FLAG_ADVARNAME | LightnCandy::FLAG_RUNTIMEPARTIAL,
  "partials" => array(
    "a" => "Hello",
    "b" => "World",
    "c" => "!"
  ),
  "helpers" => array(
    "bar" => function ($arg) {
    return $arg;
  }
  )
));
$render = LightnCandy::prepare($php);
$data = array(
  "foo" => array(
    "a",
    "b",
    "c"
  )
);
echo $render($data);
handlebars.js
Partials:
aHello
bWorld
c!
Data:
{
  "foo": [
    "a",
    "b",
    "c"
  ]
}
Template:
{{#each foo}}{{> (bar .)}}{{/each}}
Result:
HelloWorld!

Check the code to know used helper codes

Source Code 
var Handlebars = require('handlebars');
var template = '{{#each foo}}{{> (bar .)}}{{/each}}';

Handlebars.registerHelper({
  'bar': function (arg) {
  return arg;
}
});
var render = Handlebars.compile(template);
var data = {
  "foo": [
    "a",
    "b",
    "c"
  ]
};
console.log(render(data, {
 partials: {
  "a": "Hello",
  "b": "World",
  "c": "!"
}}));

See Also...

Search the cookbook

Generated at 2022-03-21T13:13:56.019Z