Как условно выбрать шаблон с Ractive

Я пытаюсь выбрать шаблон условно. Моя идея заключалась в том, что у меня будет контейнер (представление) со списком компонентов, где каждый компонент будет указывать, какой шаблон он должен использовать.

{{#view.components}}
   {{> {{template.id}} }}
{{/view.components}}

Я бы хотел, чтобы частичное объявление разрешило {{template.id}} из свойства компонента с именем id, а затем разрешило частичное.

i.e.

view.components[0].template.id = "fooTemplate" (<script id="fooTemplate" />)
view.components[1].template.id = "barTemplate" (<script id="barTemplate" />)

и активно разрешать блок #view.components как

{{>fooTemplate}}
{{>barTemplate}}

Этот {{>template.id}} говорит мне, что не может разрешить template.id. Этот {{>{{template.id}} }} говорит мне, что ничего не знает о t.

Любой обходной путь, который я мог бы использовать?


ractivejs
person Matt Searles    schedule 16.03.2014    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Взгляните на документы: http://docs.ractivejs.org/latest/partials в «Инъекция партиалов».

Вы можете сделать что-то подобное в частичных:

ractive = new Ractive({
  el: myContainer,
  template: myTemplate,
  partials: {
    content: anyBooleanExpression ? fooTemplate: barTemplate,        
  }
});

Вы можете использовать то же условие в свойстве шаблона:

template: anyBooleanExpression ? fooTemplate: barTemplate,

И даже использовать более сложные условные операторы, добавляя блок переключения или анонимную функцию.

template: function(){ /* you complex logic */ },

Как в этой скрипке

person Johann Echavarria    schedule 06.04.2014

arrow_upward
0
arrow_downward

Вы можете определить свой шаблон, как показано ниже:

   {{#view.components}}
      {{#FooTemp}}
        {{>fooTemplate}}
      {{/FooTemp}}
      {{#BarTemp}}
        {{>barTemplate}}
      {{/BarTemp}}
    {{/view.components}}

и ваша модель выглядит так:

{
  view: {
    components: [
      {
        FooTemp: { ... }
      },
      {
        BarTemp: { ... }
      }
    ]
   }
}
person fengyj    schedule 30.06.2014