Question

我正在我的应用中使用页面模板以保持良好和干燥，例如{{> navbar}} partials等。

＆＃xA;＆＃xA;

我正在尝试为了避免将每个模板放在index.html中，但将它们放在它们所使用的页面内，使得当页面加载时，Template7会尝试在标签内执行模板并输出错误。

＆＃ xA;＆＃xA;

是否有我遗漏的东西，或者我实际上必须将所有内容放入索引文件中？

＆＃xA;

Answer 1

您不必将所有内容都放在索引文件中 - 实际上，我的应用程序几乎没有任何内容。

你应该真正拥有的东西是你总是需要展示或准备好展示的东西（某种类型的主要容器或菜单）。其他一些有时使用或者只是应该弹出的东西我用javascript创建如下：

function createRandomPage() {

    // Main container
    var randomPage = document.createElement('div');
    randomPage.className = "mainPages";
    var randomText = document.createElement('p');
    randomText.className = "mainPagesText";
    randomText.innerText = "Hello I'm a new page";
    randomPage.appendChild(randomText);

    // Destroys page when you move it off of the screen
    // Doing this avoids unnecessary memory usage
    randomPage.addEventListener('animationend', function() {
        if (randomPage.style.animationName == "removeRandomPage") {

            console.log("destroying random page");
            document.body.removeChild(randomPage);
        }
    });

    document.body.appendChild(randomPage);
}

Answer 2

最后，我最终将模板放在一个目录中，每个文件一个，并通过AJAX加载它们以将编译后的模板传递给回调。

function loadTemplate(name, callback) {
     $.get('templates/' + name + '.tpl', function(template) {
         callback(Template7.compile(template));
    });
}

防止<script>标记内的模板在页面模板中执行

2 个答案: