淘汰赛JS绑定到对象的属性答案

【问题标题】：knockout JS bind to properties of object淘汰赛JS绑定到对象的属性
【发布时间】：2012-09-23 01:44:20
【问题描述】：

我需要将一些 HTML 绑定到一个对象，但我的问题是我在开发时不知道该对象的属性。

我的主视图模型中有一个 selectedItem 属性，我已将其绑定到我的 HTML 中的一个部分：

<div data-bind="with: selectedItem">

</div>

现在我想根据属性名和属性值生成一个表：

<div data-bind="foreach: [WHAT DO I PUT HERE?]">
    <label class="control-label"><span data-bind="text: [OR HERE?]" /></label>
</div>

我真的不知道该怎么做。非常感谢任何帮助。

另外，只是稍微扩展一下，我想以不同的方式处理绑定对象的属性，例如，如果该属性只是一个原始类型，则输出它，但如果它是另一个对象/数组，则处理它特别是。

这个可以吗？

【问题讨论】：

标签： javascript html mvvm knockout.js

【解决方案1】：

如果其他人想要绑定一个简单对象的属性。你可以这样做......

<table>
    <tbody data-bind="foreach: arrayOfObjects">
        <tr data-bind="foreach: Object.keys($data)">
            <td data-bind="text: $parent[$data]"></td>
        </tr>
    </tbody>
</table>

注意：旧版浏览器不支持 object.keys，但您可以使用它来添加向后兼容性http://whattheheadsaid.com/2010/10/a-safer-object-keys-compatibility-implementation

【讨论】：

【解决方案2】：

Here 是一个工作示例，使用 computed observable 在运行时选择要显示的数据。动态选择的templates也用于根据要渲染的数据类型（数组或标量）来渲染数据。

【讨论】：

这是一个好的开始，但我看不出这将如何让我访问我在设计时不知道的视图模型的属性。能详细点吗？
当然。属性“selected”包含要在视图模型中选择的属性的名称（可以在运行时更改）。更改此值（可观察）将触发属性“数据”（计算可观察）的更新。最后一个属性动态选择（参见self[selection]）数据（list1 或item1）以使用相应的模板呈现。希望这能澄清这个例子。
啊，我明白你做了什么，谢谢。但也许我没有理解你的想法，或者我没有很好地描述这个问题。我 Model 类有 X 个属性（在你的情况下是 2，但我的有大约 20 个），我想列出所有属性并根据该属性的类型选择一个模板。在您的示例中，您已经对选择列表中的属性进行了硬编码，而我不知道它们......这有意义吗？
选择列表仅用于示例。您可以通过另一种方式完美地更改属性 selected 的值。我用 2 个属性做了这个例子，但你可以有很多。要选择要显示的正确属性，只需将其名称放在 selected 属性中，模板将根据类型自动选择。在您的情况下，您将如何选择要显示的属性？
我想我现在了解你了。 this example 是你要找的吗？