aframe-template-component + nunjucks 模板显示在代码中但未出现在场景中

Question

我对 Nunjucks 知之甚少，所以如果我完全走错了方向，我深表歉意，但这是我将它与 aframe-template-component 结合使用以在不同位置生成 10 个建筑实体的尝试。

我在 index.html:

中创建了这个脚本标签

<script id="building" type="text/x-nunjucks-template">
  {% for x in range(0, 10) %}
    <a-entity template="src: building.template; type: handlebars"
              data-position="{{ x * 10 }} 1 0" 
              data-positionB="{{ x * 10 }} 1 0" 
              from="#frontInner{{ x }}" 
              to="#frontOuter{{ x }}">
    </a-entity>
  {% endfor %}
</script>

我在场景中放置了这个实体：

<a-entity template="src: #building"></a-entity>

我创建了一个 building.template 文件（我想创建多个版本的建筑的简化版本）：

                    <rw-room data-position material="color:#866" width="4.8" length="4.8" height="3">
                        <rw-wall >              
                            </rw-wall>
                            <rw-wall >
                            </rw-wall>
                            <rw-wall >
                                <rw-doorhole id="frontInner{{ x }}" material="color:#866"></rw-doorhole>
                            </rw-wall>   
                            <rw-wall >

                            </rw-wall>
                            <rw-floor material="color:#870"></rw-floor>
                            <rw-ceiling material="color:#880"></rw-ceiling>
                        </rw-room>
                        <rw-room data-positionB material="color:#866" width="5" length="5" height="3" outside="true">
                            <rw-wall ></rw-wall>
                            <rw-wall ></rw-wall>
                            <rw-wall ></rw-wall>
                            <rw-wall >
                                <rw-doorhole id="frontOuter{{ x }}" material="color:#866"></rw-doorhole>
                                <rw-doorlink from to position="2.5 0 0" material="color:#866" >
                                    <rw-floor material="color:#866"></rw-floor>
                                    <rw-ceiling material="color:#866"></rw-ceiling>
                                    <rw-sides material="color:#866"></rw-sides>
                                </rw-doorlink>
                            </rw-wall>
                            <rw-floor material="color:#866"></rw-floor>
                            <rw-ceiling material="color:#866"></rw-ceiling>
                        </rw-room>

The code seems to be appearing in the console

One issue I noticed is that the id's aren't updating as they should, should be id="frontOuter1"

然而，建筑物在场景中并没有出现在视觉上。非常感谢任何有关如何解决此问题的建议！

Answer 1

rw-rooms, rw-wall... 不是 A-Frame 实体，它们不会被渲染。在模板中使用 a-entity 和 mixins 而不是 wr-XXX 元素。例如：

<a-entity mixin="wall"></a-entity>

<a-mixin id="wall" material="color: red"></a-mixin>

aframe-template-component + nunjucks 模板显示在代码中但未出现在场景中

aframe-template-component + nunjucks template showing in code but not appearing in scene

aframe

nunjucks