Передача вывода компонента Handlebars в качестве параметра помощнику - PullRequest
Новая
       63

Передача вывода компонента Handlebars в качестве параметра помощнику

0 голосов
/ 16 октября 2018

Я бы хотел использовать вывод компонента в качестве параметра для моего помощника, но не добился большого успеха.

Мой шаблон Ember выглядит примерно так: 

<td class="wrap">
  {{generate-url 'http://stackoverflow.com' 'Visit'}}
</td>

и помощник: 

import { helper } from '@ember/component/helper';
import { htmlSafe } from '@ember/string';

export function helperFunction (params) {
    if (!params) {
        return "";
    }

    var link = params[0];
    if (!link) {
        return  "";
    }

    var linkText = params[1];
    if (!linkText) {
        linkText = link;
    }

    return new htmlSafe('<a href="' + link + '">' + linkText + '</a>');
}

export default helper(helperFunction);

Два вместе сгенерированных успешно генерируют: 

<td class="wrap">
  <a href="http://stackoverflow.com">Visit</a>
</td>

Теперь у меня есть компонент (my-component.hbs), который выводит HTML со следующими данными: 

{{#if name}}
  <span class="red">{{longName}}</span>
{{/if}}

Этот компонент работает, если на него есть ссылка в шаблоне, например так: {{my-component name="abc" longName="alphabet"}} (отображает <span class="red">alphabet</span>, как и ожидалось).

Но я в тупике, пытаясь получить вывод HTML вВторой параметр generate-url для получения: 

<td class="wrap">
  <a href="http://stackoverflow.com"><span class="red">alphabet</span></a>
</td>

Я попытался наивно {{generate-url 'http://stackoverflow.com' (my-component name="abc" longName="alphabet")}}, но он выводит ошибки, когда оценивается этот конкретный руль.

1 Ответ

0 голосов
/ 17 октября 2018

Спасибо за разъяснения, сначала было немного трудно понять.

Я не использую ember.js, а только сырой Handlebars.js.Однако, на мой взгляд, вы не можете связать помощников для передачи результатов от одного к другому, даже встроенный помощник поиска не поможет.Если вы хотите сделать это, вы можете установить ember-composable-helpers .Другое решение, которое я нашел на https://github.com/wycats/handlebars.js/issues/304, заключается в использовании специального помощника, который будет связывать ваши вызовы: 

Handlebars.registerHelper('chain', function() {
  var helpers = [];
  var args = Array.prototype.slice.call(arguments);
  var argsLength = args.length;
  var index;
  var arg;

  for (index = 0, arg = args[index];
       index < argsLength;
       arg = args[++index]) {
    if (Handlebars.helpers[arg]) {
      helpers.push(Handlebars.helpers[arg]);
    } else {
      args = args.slice(index);
      break;
    }
  }

  while (helpers.length) {
    args = [helpers.pop().apply(Handlebars.helpers, args)];
  }

  return args.shift();
});

, и вот один пример вызова: 

{{chain "taxAdd" "formatPrice" this.product.price}}

Надеюсь, это поможет.Я также отредактирую ваш пост, добавив тег emberjs, чтобы кто-то еще мог дать лучший ответ.

...