javascript - 使用 meteor 中的 Iron Router 动态加载 js 内容，在 return 语句中使用数组

Question

我想使用meteor中的iron router来加载属于指定模板的js内容。 return 语句返回纯文本 - 对于带有某些 html 语句的数组来说没有用。如何通过在 Template.info.helpers 中使用以下数组和以下 html 语句来返回它？

.js

Router.route('/', function () {
    this.render('info');
});

Router.route('info');

Router.route('/hello', function () {
    this.render('hello');
});

Template.info.helpers({
    info() {
        var iterate ="";
        for (var i = 0; i < 10; i++){
            iterate += "<div class='row'>" + i + "</div>";
        }
        return iterate;
    } // Gives raw text -> Works NOT fine: <div class='row'>0</div><div class='row'>1</div>...
)};

Template.hello.helpers({
    hello() {
        var text = "Hello";
        return text;
    } // Works fine
)};    

.html

<template name="hello">
   <a href="{{pathFor route='info'}}">Home</a>
   </br>
   <a href="{{pathFor route='hello'}}">hello</a>
   <p>{{hello}}</p>
</template>

<template name="info">
   <a href="{{pathFor route='info'}}">Home</a>
   </br>
   <a href="{{pathFor route='hello'}}">hello</a>
   <p>{{info}}</p> <!-- Gives raw text -> Works NOT fine: <div class='row'>0</div><div class='row'>1</div> ... and so on -->
</template>

请帮忙。已经有了一个有用的遮阳篷，但我现在遇到了另一个问题......:)

Answer 1

好的，我现在明白问题了。您试图从助手中直接操作 DOM，但实际情况是您的助手永远不会运行，因为您没有引用 html 中的助手。不仅如此，您的助手中没有任何反应数据。

比在助手中操作 DOM 简单得多，只需让助手返回您需要的字符串，然后使用 {{hello}} 将它们直接插入到您的模板中， {{信息}}

js:

Template.info.helpers({
    info() {
        return "Some info";
    }
)};

Template.hello.helpers({
    hello() {
        return "Hello";
    }
)};

html:

<template name="hello">
   <a href="{{pathFor route='info'}}">Home</a>
   </br>
   <a href="{{pathFor route='hello'}}">hello</a>
   <p id="hello">{{hello}}</p>
</template>

<template name="info">
   <a href="{{pathFor route='info'}}">Home</a>
   </br>
   <a href="{{pathFor route='hello'}}">hello</a>
   <p id="info">{{info}}</p>
</template>

{{hello}} 告诉 blaze 找到键名为“hello”的助手并将其插入此处。

请注意，{{> hello}} 和 {{hello}} 将执行完全不同的操作。第一个将插入整个模板，其名称是“hello”，第二个将渲染“hello”helper的结果。 p>

如果您的助手返回 html 而不是纯文本，那么您需要在模板中使用三大括号，即

{{{hellohtml}}}