KnockOut Mapping Иерархический объект JS

Я пытаюсь создать представление моделей, используя плагин отображения KnockOut,

Это объект, в основном ниже предложение со словами в нем.

var data = {
name: 'Example Title',
sentences: [
    {id: 1, words: [{text: 'word1'}, {text: 'word2'}]},
    {id: 2, words: [{text: 'word3'}, {text: 'word4'}]}
           ]};

Я хотел бы иметь три модели просмотра,

Статья должна содержать предложения, а предложение должно содержать слова

var ArticleViewModel = function(data) 
{
  var self = this;
  self.id = ko.observable(data.id);
  self.sentences = ko.observableArray([]);
}

var SentenceViewModel = function(data) 
{
  var self = this;
  self.id = ko.observable(data.id);
  self.words = ko.observableArray([]);
}

var WordViewModel = function(data) 
{
  var self = this;
  self.id = ko.observable(data.id);
  self.text = ko.observable(data.text);
}

Я хотел бы поместить это в вид, как показано ниже;

<p data-bind="foreach:sentences">
  <span data-bind="foreach:words">
     <span data-bind="text:text">
  </span>
</p>

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

вот мое испытание, может быть, поможет лучше понять мою проблему,http://jsfiddle.net/sureyyauslu/2wTjy/6/

Заранее большое спасибо...

Ответы на вопрос(1)

Ваш ответ на вопрос