knockout.js 可以使用模板生成模板吗？答案

【问题标题】：Can knockout.js use templates to generate templates?knockout.js 可以使用模板生成模板吗？
【发布时间】：2011-06-19 05:01:27
【问题描述】：

我正在尝试使用模板剔除来生成模板。

顺理成章

HTML:

<script id="searchField-template" type="text/html">
    <li data-bind="text: name"></li>
</script>

<script id="template-template"  type="text/html">
    <ul data-bind="template: { name: 'searchField-template', foreach: ${name} }" ></ul>
</script>

JS：

var viewModel = {
    Title: [{
        name: "Title1"},
    {
        name: "Title2"},
    {
        name: "Title3"}],
    Manager: [{
        name: "Manager1"},
    {
        name: "Manager2"},
    {
        name: "Manager3"}],

    Defn: [{
        name: "Title"},
    {
        name: "Manager"}]

};

ko.applyBindings(viewModel);

此处可运行示例：http://jsfiddle.net/scottwww/yQZUE/2/

似乎问题在于如何解释花括号。

有什么建议吗？

【问题讨论】：

标签： javascript jquery-templates knockout.js

【解决方案1】：

给你>

http://jsfiddle.net/vwP3w/2/

【讨论】：

【解决方案2】：

不确定这是不是正确的方法，但对 vm 的引用会有所帮助。

http://jsfiddle.net/scottwww/vwP3w/1/

HTML：

<div data-bind="template: { name: 'template-template', foreach: Defn }"></div>

<script id="searchField-template" type="text/html">
    <li data-bind="text: name"></li>
</script>

<script id="template-template"  type="text/html">
    <ul data-bind="template: { name: 'searchField-template', foreach: vm[$data.name] }" ></ul>
</script>

JS：

var viewModel = {
    Title: [{
        name: "Title1"},
    {
        name: "Title2"},
    {
        name: "Title3"}],
    Manager: [{
        name: "Manager1"},
    {
        name: "Manager2"},
    {
        name: "Manager3"}],

    Defn: [{
        name: "Title"},
    {
        name: "Manager"}]

};
window.vm = viewModel;
ko.applyBindings(viewModel);

【讨论】：

【解决方案3】：

在嵌套模板中使用$data 变量。

http://jsfiddle.net/dwick/yQZUE/3/

【讨论】：

模板工作正常。这是不正确的视图模型。你到底想在这里做什么？
您在外部模板中传递 Defn 并打印两个名称 'Title' 和 'Manager' 。它工作正常。你想打印视图模型中每个项目的每个名称吗？这需要稍微更改 viewModel。
@nEEbz - 是的，这正是我想要做的 - 创建一个应用于“标题”和“经理”的模板，以便将标题和经理模板化