tvos - TVML/TVJS中的动态XML模板

Question

有谁知道如何使用TVJS/TVML在Apple TV应用中动态生成模板？基本上，我想访问我的API，获取一个对象数组，然后将数据插入到XML模板中。

我一直在寻找有关如何实现此目标的信息，但很快就找到了。我发现许多教程都使用硬编码的图像，视频等，但没有动态生成的内容。

任何帮助，将不胜感激。

Answer 1

最后，我已经弄清楚了。动态生成模板并不难，但是我想重用Presenter和ResourceLoader，并将模板作为* .xml.js文件。这是我设法达到的解决方案。

对于初始 View ，我使用了catalogTemplate，如Ray Wenderlich's tutorial所示。但是，我没有展示 session 话题，而是展示了男人和女人的商品类别。选择类别后，我想显示一个带有该类别许多选项的stackTemplate。问题在于如何将任何信息(最简单的情况下是类别的标题)传递给第二个模板。

在第一个模板中，我将锁定配置如下:

<lockup categoryTitle="Women: Dresses" categoryDir="w-dresses">
  <img src="${this.BASEURL}images/dresses.jpg" width="230" height="288" />
  <title>Dresses</title>
</lockup>

在 application.js中，我附加了一个监听器，就像教程显示的一样:

doc.addEventListener("select", Presenter.load.bind(Presenter));

这是第二个模板(Category.xml.js):

var Template = function(categoryTitle) { 
    return `<?xml version="1.0" encoding="UTF-8" ?>
    <document>
      <stackTemplate>
        <banner>
          <title>${categoryTitle}</title>
        </banner>
      </stackTemplate>
    </document>`
}

这是JavaScript，因此您可以传入函数(例如，值数组)，然后相应地构造模板。棘手的部分是传递一个值。

首先，我对ResourceLoader进行了一些更改(这可以做得更好，当然，这只是概念上的证明)。我只是将 categoryTitle作为附加参数添加到顶级函数中，并在调用 Template时添加了该参数:

ResourceLoader.prototype.loadResource = function(resource, callback, categoryTitle) {
  var self = this;
  evaluateScripts([resource], function(success) {
    if(success) {
      var resource = Template.call(self, categoryTitle);
      callback.call(self, resource);
    } else {
      var title = "Resource Loader Error",
      description = `Error loading resource '${resource}'. \n\n Try again later.`,
      alert = createAlert(title, description);
      navigationDocument.presentModal(alert);
    }
  }); 
}

最后，在 Presenter中，在 load中，我将 categoryTitle传递给 resourceLoader:

load: function(event) {
  var self = this,
  ele = event.target,
  categoryTitle = ele.getAttribute("categoryTitle");
  if (categoryTitle) {
    resourceLoader.loadResource(`${baseURL}templates/Category.xml.js`, function(resource) {
        var doc = self.makeDocument(resource);
        self.pushDocument(doc);
    }, categoryTitle);
  }
},

这对我有用。

最后一点:在某些类别中，我有带有“＆”号的标题，例如 'Tops & T-shirts'。自然，我用XML实体 'Tops & T-shirts'替换了＆符。但是，这行不通，可能是因为该字符串被解码了两次:第一次将实体转换为“＆”号，第二次将单个“＆”号标记为错误。对我有用的是: 'Tops & T-shirts'!