CanJS: есть ли способ назначить весь viewModel компонента при создании экземпляра?

Question

Я делаю похожий на список компонент в своем приложении, и я хотел бы извлечь элемент списка в отдельный дочерний компонент. Некоторое время я боролся, но не нашел способа назначить viewModel компонента при создании экземпляра.

Раздетый пример:

can.Component.extend({
    template: '{{#items}}' +
              // '<item data="{.}"></item>' + // (1) Can do this.
              // '<item title="title" value="value"></item>' + // (2) Can do this
              '<item @viewModel="{.}"></item>' + // Want something like this.
              '{{/items}}'
    // ...
});

can.Component.extend({
    tag: 'item'
    // ...
});

Рабочий пример на jsfiddle: http://jsfiddle.net/scaryzet/7pnh5ujn/1/

В настоящее время я знаю 3 способа справиться с этим.

1. Привязать данные дочернего компонента к ключу (как в моей скрипке по ссылке выше).
2. Свяжите все необходимые поля, указав их все в теге - боль в заднице.
3. Не извлекайте отдельные элементы списка в отдельные компоненты.

Я надеюсь, что есть решение моей проблемы.

Answer 1

У меня есть решение моей проблемы здесь: https://github.com/bitovi/canjs/issues/1978

На самом деле вы можете определить пользовательское поведение для инициализации viewModel, предоставив функцию viewModel. Это также описано в документации: http://canjs.com/docs/can.Component.prototype.viewModel.html

Как предложено в ответе на вопрос о github, следующий подход может быть использован для использования контекста представления в точке создания компонента в качестве viewModel экземпляра компонента без указания явных привязок в теге компонента.

can.Component.extend({
  tag: "item",
  viewModel: function (attrs, parentScope) {
    return parentScope._context;
  }
})

Answer 2

Я только начинаю с CanJS, но, возможно, может сработать следующее.

Там, кажется, есть data помощник, который вы можете использовать для передачи контекста.

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

Вот jsfiddle.