Handlebars: IfEq, IfNotEq, Switch
Столкнулся с необходимостью использовать простые шаблоны в одном из проектов. В качестве шаблонизатора был выбран Handlebars (handlebarsjs.com). К сожалению, в нем нет некоторых нужных мне операторов, поэтому решено было расширить функционал парой не хитрых, но очень полезных хелперов..
ifEq = Проверяет соответствие переменной строке
|
1 2 3 4 |
Handlebars.registerHelper('ifEq', function (a, b, options) { if (a == b) { return options.fn(this); } return options.inverse(this); }); |
Пример использования
|
1 2 3 |
{{#ifEq greatings "Hello world"}} Hello world {{/ifEq}} |
ifNotEq = Проверяет на НЕ соответствие переменной строке
|
1 2 3 4 |
Handlebars.registerHelper('ifEq', function (a, b, options) { if (a != b) { return options.fn(this); } return options.inverse(this); }); |
Пример использования
|
1 2 3 |
{{#ifNotEq greatings "Hello world"}} NOT Hello world {{/ifNotEq}} |
Switch = Заменитель конструкции switch
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 |
Handlebars.registerHelper("switch", function(value, options) { this._switch_value = value; this._switch_break = false; var html = options.fn(this); // Process the body of the switch block delete this._switch_value; return html; }); Handlebars.registerHelper("case", function(value, options) { if (value == this._switch_value) { this._switch_break = true; return options.fn(this); } }); Handlebars.registerHelper("caseList", function(value, options) { if (value.split(',').map(str=>str.trim()).indexOf(this._switch_value) > -1) { this._switch_break = true; return options.fn(this); } }); Handlebars.registerHelper('caseDefault', function(value, options) { if (this._switch_break == false) { return value.fn(this); } }); |
Пример использования. Обратите внимание, что при необходимости использовать caseDefault, он должен быть объявлен последним
|
1 2 3 4 5 6 7 8 9 10 11 |
{{#switch name}} {{#case 'John'}} Male {{/case}} {{#caseList 'Lena, Katya'}} Female {{/caseList}} {{#caseDefault}} Unrecognized {{/caseDefault}} {{/switch}} |
Author: | Rating: / | Tags:
Leave a Reply